HTML电子邮件对齐文本和图像 [英] Html email align text and image

问题描述

我无法将图像与文本对齐.该问题仅出现在Outlook 03,07&中； 10.参见此图片，可以更好地理解我的问题:

I'm having trouble aligning an image with text. The problem only occurs in outlook 03,07 & 10. See this picture to get a better understanding of my problem:

这是我的代码:

<td valign="middle" style="color:#fff;  font-size:18px; padding-left:3%;" width="600" height="34" bgcolor="#1a292f">
    <span class="nonmobile_content">
        Onsdag
    </span>                         
    <span style="font-weight: bold">
        21.03
    </span>                     
    <span style="color:#87bcd8;">
        2013
    </span>                     
    <span style="color:#87bcd8;">
        uke 11
    </span>
    <span>
        <img src="retriever-logo-top.png" align="right">
    </span>
</td>
<td bgcolor="#1a292f">
    &nbsp;&nbsp;&nbsp;
</td>

推荐答案

是否有理由将所有内容都放在一个表单元格中，而不是将图像放在单独的单元格中?您可以简单地:

Is there a reason you're putting this all in one table cell rather than putting the image in a separate cell? You could simply:

<tr>
    <td colspan="2">
        Retriever (1), Cision (2), ...
    </td>
</tr>
<tr>
    <td ... >
        <span class="nonmobile_content">
            Onsdag
        </span>                         
        <span style="font-weight: bold">
            21.03
        </span>                     
        <span style="color:#87bcd8;">
            2013
        </span>                     
        <span style="color:#87bcd8;">
            uke 11
        </span>
    </td>
    <td>
        <img src="retriever-logo-top.png" align="right">
    </td>
</tr>

然后将width添加到每个单独的td中，只需将其添加到表中即可:

Then rather adding width to each individual td simply add it to the table:

<table width="600">

这篇关于HTML电子邮件对齐文本和图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！