Question

我已经创建了HTML电子邮件，这一切都运行得很好，但有些部分我使用内联css（填充：0 36px 15px 140px）在文本之前有一个空部分。它在桌面上看起来都很好，但是当我在移动设备上打开它时，长行显示为两行，因为左侧的140px填充对于它们来说太大了。我该如何解决这个问题？

这是我到目前为止所尝试的：

<style type="text/css">


    @media screen and (max-width: 525px) {


    .smaller {
        padding: 0px 36px 15px 100px;
    }

<td style="padding: 0px 36px 15px 140px; font-size: 16; font-family: Helvetica; font-weight: bold;" class="smaller">

所以我正在为较小的设备声明媒体查询，然后我尝试将其应用于类，但填充不会改变。我怎样才能做到这一点？风格在头脑中，我应该把它放在别的地方吗？

Answer 1

尝试添加覆盖!important

的inline-style

@media screen and (max-width: 525px) {

    .smaller {
        padding: 0px 36px 15px 100px !important;
    } 
}

Answer 2

使用！important指令覆盖继承。

.smaller {
    padding: 0px 36px 15px 100px !important;
}

编辑：我看到我的抽奖速度很慢......好吧，你确定要关闭你的风格标签吗？（有时它是显而易见的东西......一直发生在我身上。）