outlook - HTML 签名以不同方式呈现

Question

我正在制作一个用于 Outlook 2010 的新 html 签名。它在浏览器和大多数电子邮件客户端中看起来不错，但在 Outlook 2010 中它呈现出一点错误。正如您从 Chrome 的第一个屏幕截图中看到的那样，文本对齐到图像的右侧，但在 Outlook 的第二个屏幕中它呈现在图像下方。我该如何解决这个问题？

Chrome : Chrome http://unihouse.no/images/sig_chrome.PNG

展望: Outlook 2010 http://unihouse.no/images/sig_outlook2010.PNG

附言。我将代码直接粘贴到 Outlook 签名 html 文件中，而不使用内置编辑器。

<div id="sig" style="min-width: 960px; min-height: 82px; line-height: 18px; margin: 6px 0; padding: 8px; border-top: 1px #15345B dotted; border-bottom: 1px #15345B dotted; font-family: 'Trebuchet MS',helvetica,San-Serif; font-size: 11px; color: #15345B; " >
    <a href="http://unihouse.no" title="test.no"><img src="http://unihouse.no/images/arrows3.jpg" alt="Test AS" style="float: left; padding: 6px 20px 0 0; border: none;"></a>
    <div style="padding: 6px 0 0 0">
        <span style="font-size:11px"><strong style="color: #15345B; letter-spacing: 1px">Test Name</strong>, Unihouse Norge AS</span><br>
        <strong style="letter-spacing: 1px">Storkundeansvarlig Østlandet</strong><br>

        e-post: <a href="mailto:test@test.no" title="e-post Chris" style="text-decoration:none; border-bottom:1px dotted #15345B;color:#15345B">test@test.no </a> | tlf: +47 123 45 567<br>
        Besøksadresse: Tjuvholmen allé 3, 0252 Oslo<br>
        Hovedkontor: Innherredsveien 103, 7043 Trondheim<br>    
    </div>
    <div style="clear:both"></div>
</div>

Answer 1

您可以使用表格而不是 float div。尝试制作一个包含一行和 2 个单元格的表格。将图像放在第一个单元格中，将文本放在第二个单元格中。

这应该会强制它们在任何应用程序中彼此相邻。

<table id="sig" style="min-width: 960px; min-height: 82px; line-height: 18px; margin: 6px 0; padding: 8px; border-top: 1px #15345B dotted; border-bottom: 1px #15345B dotted; font-family: 'Trebuchet MS',helvetica,San-Serif; font-size: 11px; color: #15345B; " >
<tr>
    <td style="padding: 6px 0 0 0">
        <a href="http://unihouse.no" title="test.no"><img src="http://unihouse.no/images/arrows3.jpg" alt="Test AS" style="float: left; padding: 6px 20px 0 0; border: none;"></a>
    </td>
    <td style="padding: 6px 0 0 0">
        <span style="font-size:11px"><strong style="color: #15345B; letter-spacing: 1px">Test Name</strong>, Unihouse Norge AS</span><br>
        <strong style="letter-spacing: 1px">Storkundeansvarlig Østlandet</strong><br>
        e-post: <a href="mailto:test@test.no" title="e-post Chris" style="text-decoration:none; border-bottom:1px dotted #15345B;color:#15345B">test@test.no </a> | tlf: +47 123 45 567<br>
        Besøksadresse: Tjuvholmen allé 3, 0252 Oslo<br>
        Hovedkontor: Innherredsveien 103, 7043 Trondheim<br>    
    </td>
</tr>