电子邮件模板问题 - 表格过度扩张

Question

我有一个我创建的电子邮件模板，但我似乎无法弄清楚桌子的内容是什么，我附上了截图供参考。任何帮助都会很棒。

以下是该模板部分的代码：

<tr>
    <td style="width:27px;height:53px;display:block;float:left;padding:0;margin:0;">
        <img src="#" />
    </td>
    <td style="width:31px;height:53px;display:block;float:left;padding:0;margin:0;">    <a href="http://youtu.be" target="_blank"><img src="#" /></a>
    </td>
    <td style="width:24px;height:53px;display:block;float:left;padding:0;margin:0;">    <a href="#" target="_blank"><img src="#" /></a>
    </td>
    <td style="width:25px;height:53px;display:block;float:left;padding:0;margin:0;">    <a href="#" target="_blank"><img src="#" /></a>
    </td>
    <td style="width:518px;height:53px;display:block;float:left;padding:0;margin:0;">
        <img src="#" />
    </td>
</tr>
<tr>
    <td style="display:block;float:left;padding:0;margin:0;">
        <img src="#" />
    </td>
</tr>

Answer 1

而不是浮动，在表格单元格中使用html align="left"。表格单元格中不需要display:block;，而是将其放在图像标记中。

此外，删除表格单元格中的所有CSS宽度和高度，并将其替换为html width=""和height=""

另外，如果你把它放在你的表格标签中：border="0" cellpadding="0" cellspacing="0"，你不需要表格单元格css中的填充和边距。

所有组合的基本示例：

<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td width="31" height="53" align="left">
      <a href=""><img  alt="" src="" width="31" height="53" border="0" style="margin: 0; border: 0; padding: 0; display: block;"></a>
    </td>
  </tr>
</table>

注意 - 左对齐是默认值，因此不需要它。