HTML表格和几个电子邮件客户端的神秘高度

So I've battled against an HTML email and including Outlook support for some time now. Within the code below Gmail and Outlook both display the at 15px in height. Why? Its only meant to be a cross client hr replacement for a dotted separator line.

所以我现在已经与HTML电子邮件作斗争,并且包括Outlook支持。在Gmail和Outlook下面的代码中,两者的高度均为15px。为什么?它仅用于替换虚线分隔线的跨客户端hr。

 <!-- Dotted Horizontal border Outlook Optimized-->
<table style="width:100%;border-bottom:1px dotted #999999;" align="center" border="0" cellpadding="0" cellspacing="0">
   <tbody align="center" border="0" cellpadding="0" cellspacing="0">
      <tr align="center" border="0" cellpadding="0" cellspacing="0">
         <td style="background:none;height:1px;width:100%;vertical-align:middle;"  border="0" cellpadding="0" cellspacing="0" ></td>
      </tr>
   </tbody>
</table>

UPDATE: So its because there is an "empty" cell. I thought that an   would take care of it but more was needed. I also tried putting the 1px image inside the cell as mentioned by @Vitorino Fernandes, the height persisted.

更新:所以它是因为有一个“空”单元格。我认为会照顾它,但需要更多。我还尝试将1px图像放在@Vitorino Fernandes所提到的单元格中,高度持续存在。

The nbsp does in fact need to exist for several email clients and the use of line-height:0px; finally flattened the cell.

实际上确实需要为几个电子邮件客户端存在并且使用line-height:0px;终于弄平了牢房。

1 个解决方案

#1

as per looking at your code i understand that you are using table to give border -- dont use table because empty table will give some space use td instead and spacer image with height 1px(ad per your border height) and give bg-color to td

根据你的代码,我知道你正在使用表格给边框 - 不要使用表格,因为空表格将给出一些空间使用td代替和间隔图像高度1px(广告每边界高度)并给bg颜色TD

or if you want to use the same layout

或者如果你想使用相同的布局

add a spacer image in the empty td with height 1px and background color- as per your border and give line-height:1px to the parent tr

在空的td中添加一个高度为1px和背景颜色的间隔图像 - 根据您的边框,并给出行高:1px到父tr