我通过JS动态创建一个表格,表格布局和宽度都固定。并将列的宽度设置为固定值(以像素为单位)。但是创建的表不是根据IE7中的意图呈现的。似乎col中的width属性不起作用。但它适用于FF和Chrome。
创建的表格具有以下dom结构:
<table id="dynamicTable" cellspacing="0" width="282px" style="table-layout: fixed; overflow: hidden;">
<colgroup>
<col width="129px">
<col width="76px">
<col width="76px">
</colgroup>
<tbody>
<tr><td>head1-1</td><td>head1-2</td><td>head1-3</td></tr>
<tr><td colspan="2">head2-1,2</td><td>head2-3</td></tr>
<tr><td>head3-1</td><td>head3-2</td><td>head3-3</td></tr>
</tbody>
</table>
和css:
table {
border-style: solid solid none none;
border-width: 1px;
border-color: #c0c0c0;
}
td {
border-style: none none solid solid;
border-width: 0 0 5px 5px;
border-color: #000 #000 #c0c0c0 #c0c0c0;
padding: 10px;
margin: 0;
}
#dynamicTable {
background-color: #eee;
}
样本
有人可以解释IE7中的行为吗?