Javascript 在IE7中动态创建具有固定列宽度的表

Javascript 在IE7中动态创建具有固定列宽度的表,javascript,html,internet-explorer,html-table,fixed-width,Javascript,Html,Internet Explorer,Html Table,Fixed Width,我用JS动态创建了一个表,表的布局和宽度都是固定的。还可以将列的宽度设置为以像素为单位的固定值。但创建的表并没有按照IE7中的意图呈现。col中的width属性似乎不起作用。但它在FF和Chrome中都能工作 创建的表具有以下dom结构: <table id="dynamicTable" cellspacing="0" width="282px" style="table-layout: fixed; overflow: hidden;"> <colgroup>

我用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>
演示


有人能解释IE7中的行为吗

table layout:fixed
在IE7Col中不受支持IE7中的col width指定为content width,而在其他浏览器中它指定为sum(content width+border width+padding width)。在上面的表结构中,行的计数宽度大于表的宽度。这可能就是问题的原因。
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;
}