我想创建一个如下所示的表：
+-----------------------------------------------------------+ |January 12th,2012 | +-----------------------------------------------------------+ | x | first item | second item | +-----------------------------------------------------------+ | x | first item | second item | +-----------------------------------------------------------+ |January 13th,2012 | +-----------------------------------------------------------+ | x | first item | second item | +-----------------------------------------------------------+ | x | first item | second item | +-----------------------------------------------------------+
但我得到的是这个：
+-----------------------------------------------------------+ |January 12th,2012 | +-----------------------------------------------------------+ | x | first item | second item | +-----------------------------------------------------------+ | x | first item | second item | +-----------------------------------------------------------+ |January 13th,2012 | +-----------------------------------------------------------+ | x | first item | second item | +-----------------------------------------------------------+ | x | first item | second item | +-----------------------------------------------------------+
‘x’实际上是一个具有固定宽度的图像.我想强制第一个单元格只与图像一样宽.
这是一个示例：
<html>
<body>
<table>
<tbody>
<tr>
<td colspan="3">January 12th 2011 this here is just for padding to make table wider</td>
</tr>
<tr>
<td width="20"> x </td>
<td>First item</td>
<td>Second item</td>
</tr>
</tbody>
</table>
</body>
</html>
似乎包含带有colspan = 3的TD的行导致其他行中的TD忽略width属性(我也尝试使用样式宽度：20px)
FF8中的渲染是正确的.任何想法我如何让IE以我想要的方式呈现表格？
解决方法
我忘记了桌子的样式’table-layout：fixed’,这造成了困难.设置此样式时,第一行中单元格的宽度将应用于所有后续行.由于第一行包含一个colspan,我猜IE混淆了(FF处理好了).
任何方式它都没有我想要的那么灵活,但这对我有用.
<html>
<body>
<div style="width:350px; border:blue 1px solid">
<table border="0" style="font-family:Arial,Helvetica;font-size:10pt;table-layout:fixed;">
<tr>
<td style="width:17px;"/>
<td style="width:20px;"/>
<td style="width:180px;"/>
<td style="width:130px;"/>
</tr>
<tr>
<td colspan="4" style="width:100%;text-align:center;font-eight:bold;background-color:#eef;">09 January 2012</td>
</tr>
<tr title="09 January 2012">
<td align="center" valign="middle" colspan="1" style="width:17px;height:1.1em;"><img src="../../../../_layouts/images/WebParts2010/AWT3_Klein.png" style="border-style:None;border-width:0px;height:1.1em;width:1.1em;" /></td>
<td align="left" valign="top" colspan="1" style="width:20px;height:1.1em;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;">LO</td>
<td align="left" valign="top" colspan="1" style="width:180px;height:1.1em;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;">Customer Name Ltd.</td>
<td align="left" valign="top" colspan="1" style="width:120px;height:1.1em;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;">Reason for visiting today</td>
</tr>
</table>
</div>
</body>
</html>
