向右填充：20px；到 outlook 电子邮件中的图像

Question

这适用于 Gmail 和 Mobile Exchange，但不适用于 outlook 2010 （尽管填充应该在 2010 中有效？）。

<img src="http://coolguys.org/signature/georgeWcool.jpg" alt="Cool logo" style="display:block;padding-right:20px;">

无论有无显示块，以上内容在 outlook 中完全被忽略。并且只是结果旁边有文本，直接混入图像的一侧。同样，在 Gmail 和 Mobile Exchange 中解决得很好。

我在这张图片的右边有文字，所以使用：  是一个非常混乱的选项。还有其他类似的想法吗？（相似 = 适用于大多数地方）

下面 @Mike“多一点代码”的更新：

<tr style="height: 50px; font-size:12px;">
        <td><img src="http://coolguys.org/signature/georgeWcool.jpg" alt="Cool logo" style="display:block;padding-right:20px;"></td>
        <td style="color: #002953; max-height: 20px;">
            <span style="font-size:12px !important; font-weight: bolder;">
            This one time at band camp Lorem Ipsum</span><br>
            <span style="font-weight: bolder;font-size:12px !important;">Jeepers HTML emails suck lorem ipsum<br>
            </span>
            <br>
            <!-- etc -->

Answer 1

无论别人告诉您什么，Outlook 都支持填充。这仅取决于您定义它的位置。我建议不要在图像上填充。请记住，Padding 在元素内部，Margin 在元素外部，因此在这种情况下，您最好将其添加到图像的环绕 table 单元格中。

您在这里还有另一个选择，即为您的环绕 table 单元格指定一个宽度。此宽度应等于图像的宽度 + 20px 以考虑您的填充。那么你就不需要填充了。显然，这只有在你有一个明确定义的宽度到工作宽度的情况下才有效，而我在你的 HTML 中看到的是你没有的。如果您的元素始终是一个宽度，请将宽度添加到 Image 标签。这样，带有文本的第二个 Table 单元格将占据 table 中可用 space 的其余部分，并且始终位于图像右侧 20px

Answer 2

在 outlook 中对 td 标签使用填充。 Img 或 div 标签不支持填充。查看 http://www.campaignmonitor/css 以了解有关 CSS 电子邮件客户端兼容性的更多信息。

向右填充：20px；到 outlook 电子邮件中的图像

padding-right: 20px; to an image in outlook email

html

outlook

html-email