Question

首先关闭：
我讨厌Outlook：）

原因如下：
我正在尝试发送一封包含以下结构的电子邮件（这只是一个简单的示例，所以请不要告诉我“只是摆脱中间td s”）

<table width="400">
  <tbody>
    <tr>
       <td width="200"><img src="http://lorempixel.com/200/200/"></td>
       <td width="0"></td>
       <td width="0"></td>
       <td width="200"><img src="http://lorempixel.com/200/200/"></td>
    </tr>
  </tbody>
</table>

问题是，中间的两个td导致两张图片之间的空格，如此截图中所示http://i48.tinypic.com/6i8rvk.png

我觉得我已经尽力了。

cellpadding = 0，cellspacing = 0，border = 0 on table
使用内联css设置每个td的宽度
添加border-collapse：折叠到所有tds和表格
添加保证金：0，填充：0;边界0;到内联css的所有tds
在内联css

没有任何效果。

旁注：
如果中间只有一个空表格单元格，则渲染很好。所以似乎每个td只占半个像素这已经是一个简化的例子，我不能改变表的结构，这意味着我必须找到渲染问题的解决方法，而不是遗憾地修复相当不合适的编码风格。

测试
这是我的测试环境 - 随意使用它：http://putsmail.com/d58ffa01c4b3e29123baab00754716

Answer 1

尝试将padding-left和/或padding-right放到包含图像的tds中，如内联css。

最新编辑：试试这个 -

我从包含图像的tds中删除了宽度，因此它采用了图像的默认宽度。

Answer 2

Outlook不喜欢隐藏内容;-)但是应该有什么用 - 添加一些条件代码：

              <table border="0" cellpadding="0" cellspacing="0" style="width:100%;table-layout:fixed">
                <tr>
                  <td style="width:217px" valign="top">
                    column 1
                  </td>
                  <!--[if !mso]><!--><td style="line-height:0;max-height:0;width:0;overflow:hidden;font-size:0;display:none" valign="top">
                    hidden column 2
                  </td>
                  <!--<![endif]--><td valign="top">
                    column 3
                  </td>
                </tr>
              </table>

要将它从outlook中隐藏，带有[！mso / endif]的列周围的注释就足够了。但是你可能也想隐藏在outlook.com，gmail.com和其他一些内容中 - 为此包含其他样式。不要忘记使用媒体查询恢复移动视图中的设置。

也许您想查看为您生成此代码的https://responsive.email。

祝你好运奥列格

Answer 3

您是否尝试将<td>放在同一行？也就是说，删除元素之间的换行符？

（忽略内部元素换行符）

<td>Foo
</td><td>
Bar</td>

Answer 4

“display：none”有帮助吗？

<table width="400">
  <tbody>
    <tr>
       <td width="200"><img src="http://lorempixel.com/200/200/"></td>
       <td width="0" style="display:none"></td>
       <td width="0" style="display:none"></td>
       <td width="200"><img src="http://lorempixel.com/200/200/"></td>
    </tr>
  </tbody>
</table>

顺便说一下，我没有在Outlook 2003上遇到问题，所以我无法验证它。

Answer 5

我一直在努力解决这个问题 - 没有什么（我已尝试过这里的所有提案以及更多）工作。
最后，我更加困难，但也是最简洁的方式，我相信并编写了一个脚本，用xsl转换删除所有空列和所有空行。现在它适用于Outlook 2003 - 2010。

在Outlook中呈现零宽度表格单元格

5 个答案: