【发布时间】：2014-01-07 03:40:26
【问题描述】：
我正在尝试使用老式的编码标准来整理一封简单的 HTML 电子邮件，但我遇到了我没有预见到的一堵砖墙。 Internet Explorer，甚至是 IE 11，呈现一个简单表格的方式与我尝试过的所有其他浏览器（Chrome、Firefox、Safari）不同，我不知道为什么。
在布局方面，它应该是这样的（注意：颜色仅用于说明——请见谅！）：
但在 IE 中它看起来像这样：
HTML 非常简单：
<table border="0" cellpadding="0" cellspacing="0" width="650" bgcolor="ffffff">
<tr>
<td bgcolor="#ff0000" valign="top" height="250" width='30' rowspan="3">
Height: 250px
</td>
<td background="images/top_2_2a.gif" bgcolor="#00ff00" valign="top" width="455" height="42">
Height: 42px
</td>
<td background="images/top_2_3a.gif" bgcolor="#0000ff" valign="top" width="135" height="116" rowspan="2">
Height: 116px
</td>
<td bgcolor="#ff00ff" valign="top" height="250" width='30' rowspan="3">
Height: 250px
</td>
</tr>
<tr>
<td background="images/top_2_2b.gif" bgcolor="#00ffff" valign="top" width="455" height="208" rowspan="2">
<div>
<div style="font-size:43px; color:#000; font-family: arial; vertical-align: bottom">
Height: 208px
</div>
</div>
</td>
</tr>
<tr>
<td background="images/top_2_3b.gif" bgcolor="#ffff00" valign="top" width="135" height="134">
<div>
<div style="padding-bottom:0px;font-size:13px; color:#000; vertical-align: bottom;font-family: arial">
Height: 134px
</div>
</div>
</td>
</tr>
</table>
JSFiddle: http://jsfiddle.net/mCLDh/
是我做错了什么，还是 IE 这么多年还在惹我？
（注意：对于不知道的评论者，您不能在 HTML 电子邮件中使用浮动或绝对定位。这就是我使用看起来像是来自 1998 年的代码的原因。它很丑，但是它更受电子邮件客户端的支持。）
【问题讨论】：
-
+1 到 这么多年 IE 还在惹我吗？ 也许是吧！
-
W3C 浏览器标准是许多浏览器开发团队遵守的标准。 W3C 浏览器标准以幽默漫画的形式出现在 IE 开发人员的办公室中。
-
根据您想要的输出，我不一定认为表格是在这种情况下使用的合适元素。
-
定位的 div 或其他语义上合适的块级元素。
-
@MrSlayer 我很想使用浮动（不是绝对定位），但我不能——因为这是一封 HTML 电子邮件。大多数电子邮件客户端不支持这些功能。这是我使用可怕、丑陋的旧学校代码的唯一原因。
标签： html css internet-explorer html-table html-email