表單元格的寬度基於使用COLGROUP不作品COLGROUP不工作

Question

設置寬度表格單元中IE9

<table id="Grid1_Table" class="Table"> 
    <colgroup> 
     <col style="width:20px"> 
     <col style="width:20px"> 
     <col style="width:180px"> 
     <col style="width:200px"> 
    </colgroup> 
    <tbody> 
     <tr> 
      <td class="RowHeader"><div>&nbsp;</div></td> 
      <td class="RecordPlusCollapse"><div>&nbsp;</div></td> 
      <td colspan="2" class="GroupCaption">Order ID: 0 - 1 Items</td> 
     </tr> 
    </tbody> 
</table> 

.RowHeader 
{ 
    background-color : black; 
} 
.GroupCaption 
{ 
    background-color : #868981; 
} 
.RecordPlusCollapse 
{ 
    background-color : red; 
} 
.Table{ 
    width: 100%; 
} 

首先2 <td>寬度不如IE9 colgroup。不知道爲什麼寬度不同。

http://jsfiddle.net/KgfsM/3/

Answer 1

你給表100％的寬度然後去固定寬度的cols。瀏覽器應該從哪裏獲取缺少的寬度？它只是拉伸表格單元格。

看看下面這個例子，工作在每一個主要的瀏覽器，從IE 5（！）:) http://jsfiddle.net/Volker_E/ppRgV/1/

的變化，從表中剝離width: 100%;並添加table-layout: fixed;

.Table { 
    table-layout: fixed; 
}