html - HTML 电子邮件中包装表之间的水平间距 - 尝试了各种修复

Question

我在 2 个包装表之间有一个水平空间(仅在某些客户端中，例如 outlook、2003、2007、gmail 和其他一些 - 在大多数客户端中工作正常)- 链接到图像:

http://jimharrison.co.uk/wp-content/uploads/2013/11/Untitled-1.jpg

我试过:

边框:折叠； - 显示: block ； (在图像上)- valign="顶部"- 删除标签之间的空白 - 重置表格边距、填充和边框(这让我的内容左对齐，所以非常不可以)

完全有可能修复真的很明显...... - 在此处查看代码和电子邮件:

http://jimharrison.co.uk/wp-content/uploads/2013/11/index.html

Answer 1

将您的内容放入表格行中，而不是堆叠表格中。您可以嵌套在这些表格行中，只是尽量避免在同一父元素中使用多个表格(在代码中彼此相邻)。

此外，在包含那些(现在嵌套的)表格的表格行的 td 上设置所需的 bgcolor。

<table width="600" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td bgcolor="#2f1d36">
      <table width="100%" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td>
            this is your purple table
          </td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td bgcolor="#d76118">
      <table width="100%" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td>
            this is your orange table
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table> 

设置父元素颜色始终是一个好习惯，因为当有人从 Outlook 转发电子邮件时，这样扩展是不可避免的。在那里设置颜色不会阻止出现间隙，但会隐藏创建的白色(或任何颜色)条纹/间隙。