HTML电子邮件高度问题

时间:2013-07-02 13:09:58

标签: html internet-explorer email

我正在编写HTML电子邮件,但我遇到了以下HTML的问题:

<table width="510" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td colspan="7" width="30" valign="top"><img src="http://www.dmxs.nl/upc/Luiaard/UPC5_08.jpg" alt="Voor slecht € 28,20 per maand" style="display:block;" border="0" /></td>
    <td rowspan="2" width="455" bgcolor="#fff209" style="font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:18px;" align="left"><span style="font-size:14px;"><strong>Titel</strong></span><br /><br />

<strong>- kop 1</strong><br /> 
<strong>- kop2</strong><br />
      <span style="margin-left:20px;">• mini1<br />
      </span>
      <span style="margin-left:20px;">• mini2<br />
      </span>
      <span style="margin-left:20px;">• mini3<br />
      </span>
<strong>- kop3<span style="text-decoration:none;"></span></strong><br />
<br />
<a href="####" style="border:none; text-decoration:none;"><img src="http://www.dmxs.nl/upc/Luiaard/UPC4_14.jpg" alt="" border="0" width="141" /></a></td>
    <td colspan="6" width="25" height="72" valign="top"><img src="http://www.dmxs.nl/upc/Luiaard/UPC5_10.jpg" alt="Voor slecht € 28,20 per maand" style="display:block;" border="0" /></td>
  </tr>
  <tr>
    <td width="5"  bgcolor="#e7e7e8" style="font-size:1px; width:5px;">&nbsp;</td>
    <td width="1"  bgcolor="#e7e7e8" style="font-size:1px; width:1px;">&nbsp;</td>
    <td width="1"  bgcolor="#dededf" style="font-size:1px; width:1px;">&nbsp;</td>
    <td width="1"  bgcolor="#cbcbcc" style="font-size:1px; width:1px;">&nbsp;</td>
    <td width="1"  bgcolor="#b0b0b1" style="font-size:1px; width:1px;">&nbsp;</td>
    <td width="1"  bgcolor="#8b8b8b" style="font-size:1px; width:1px;">&nbsp;</td>
    <td width="20" bgcolor="#fff209"></td>
    <td width="20" bgcolor="#fff209"></td>
    <td width="1"  bgcolor="#8f8e81" style="font-size:1px; width:1px;">&nbsp;</td>
    <td width="1"  bgcolor="#adadae" style="font-size:1px; width:1px;">&nbsp;</td>
    <td width="1"  bgcolor="#cacacb" style="font-size:1px; width:1px;">&nbsp;</td>
    <td width="1"  bgcolor="#ddddde" style="font-size:1px; width:1px;">&nbsp;</td>
    <td width="1"  bgcolor="#e6e6e7" style="font-size:1px; width:1px;">&nbsp;</td>
  </tr>
</table>

在Chrome和Firefox中,这非常有用,但在Internet Explorer中,以下部分无效(未显示)。

<td width="5"  bgcolor="#e7e7e8" style="font-size:1px; width:5px;">&nbsp;</td>
        <td width="1"  bgcolor="#e7e7e8" style="font-size:1px; width:1px;">&nbsp;</td>
        <td width="1"  bgcolor="#dededf" style="font-size:1px; width:1px;">&nbsp;</td>
        <td width="1"  bgcolor="#cbcbcc" style="font-size:1px; width:1px;">&nbsp;</td>
        <td width="1"  bgcolor="#b0b0b1" style="font-size:1px; width:1px;">&nbsp;</td>
        <td width="1"  bgcolor="#8b8b8b" style="font-size:1px; width:1px;">&nbsp;</td>
        <td width="20" bgcolor="#fff209"></td>
        <td width="20" bgcolor="#fff209"></td>
        <td width="1"  bgcolor="#8f8e81" style="font-size:1px; width:1px;">&nbsp;</td>
        <td width="1"  bgcolor="#adadae" style="font-size:1px; width:1px;">&nbsp;</td>
        <td width="1"  bgcolor="#cacacb" style="font-size:1px; width:1px;">&nbsp;</td>
        <td width="1"  bgcolor="#ddddde" style="font-size:1px; width:1px;">&nbsp;</td>
        <td width="1"  bgcolor="#e6e6e7" style="font-size:1px; width:1px;">&nbsp;</td>

有没有人有解决这个问题的方法(不,我们不能将高度设置为静态)?

Fiddle example.

1 个答案:

答案 0 :(得分:0)

&nbsp;放入2个空表格单元格中。

资源管理器/ Outlook已知会折叠空表格单元格,由于某种原因这会阻止该行的其余部分呈现。