Windows 上的 Microsoft Outlook 为我的 H4 添加了填充

Question

请看下图：

你看到有一个突出显示的<h4> 元素（如果有任何混淆，灰色不是背景颜色，是我突出显示文本）。它具有明确声明 padding-bottom: 0; 和 line-height: 18px; 的内联样式（与字体大小相同 - 不确定这是否适用于 Outlook，但我想我会试一试）。此外，HTML 被完全缩小（因此它不是由空格或制表符引起的），并且代码已经检查了隐藏的换行符（没有）。

尽管如此，Microsoft Outlook（仅在 Windows 上）很高兴地忽略了我，并在元素下方添加了所有额外的空间。关于如何解决这个问题，我已经提出了一些想法。

如何固定此页眉元素的高度，使其仅是文本的高度？

Answer 1

我觉得这些规则很有帮助：

 #outlook a{
        padding:0;
    }
    .ReadMsgBody{
        width:100%;
    }
    body{
        width:100% !important;
        min-width:100%;
        -webkit-text-size-adjust:100%;
        -ms-text-size-adjust:100%;
        -webkit-font-smoothing: antialiased;
    }
    v*{
        behavior:url(#default#VML);
        display:inline-block;
    }
    .ExternalClass{
        width:100%;
    }
    td{
        border-collapse: separate !important;
    }
    .ExternalClass,
    .ExternalClass p,
    .ExternalClass span,
    .ExternalClass font,
    .ExternalClass td,
    .ExternalClass div{
        line-height:100%;
    }

还可以添加一条规则，将 h4 行高重置为 0：

 h4{
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    line-height:100%;
 }

然后加回行高INLINE：

 <h4 style: font-size: 24px; color: #000000; line-height: 1.8em;">This is an h4 headline</h4>