Css webkit空td为1px

Css webkit空td为1px,css,layout,webkit,html-email,Css,Layout,Webkit,Html Email,我正在为我的公司设计一个html电子邮件模板。我正在使用一个旧的html表黑客将文本定位在背景图像上,看起来像这样 <table> <tr> <td></td> <td rowspan="2">Background image goes here</td> </tr> <tr> <td colspan="2">Text will be displayed

我正在为我的公司设计一个html电子邮件模板。我正在使用一个旧的html表黑客将文本定位在背景图像上,看起来像这样

<table>
  <tr>
    <td></td>
    <td rowspan="2">Background image goes here</td>
  </tr>
  <tr>
    <td colspan="2">Text will be displayed over top of the background image</td>
  </tr>
</table>

背景图像在这里
文本将显示在背景图像的顶部
这在firefox等web浏览器中运行良好,但在chrome和safari中,我注意到第一行的空
宽度为1px,这打破了设计

我创建了一个示例来演示电子邮件模板设计中的效果。带有促销、礼品卡和联系人链接的行是效果最显著的地方。您可以看到该行的白色边缘看起来偏移了1px。在Firefox中看起来不错你必须使用Chrome或Safari才能看到问题


这种在电子邮件中使用背景图像的技术是我发现的最兼容的方式。还有更好的办法吗?有没有办法让webkit浏览器将
呈现为零宽度?

我所知道的在所有(相关)浏览器和客户端中使背景图像适用于电子邮件的唯一方法是不使用背景图像,尤其是不使用花哨的黑客,无论这种技术多么有趣


你应该能够在你的小提琴作品的布局,通过切片你的横幅图像,并添加一些更多的细胞。类似于您使圆角工作的方式…

您额外的1px偶尔会显示一次

您的堆叠表彼此重叠,边距:自动可以从像素移动

为表格设置边框以查看它们的位置,您可以在表格内管理边距,而不是空的td。


不久前看到:)@GCyrillus我的表中已经有了cellpadding=0,我尝试添加td{padding:0;},但没有效果
/* removed left td and put 20px margin on row links for example. + borders to show tables area */