Internet Explorer 8忽略表上的colgroup宽度

Question

出于某种奇怪的原因，IE忽略了我的列宽，只是将所有六列设置为相等的宽度。

table{
table-layout: fixed;
} 

<colgroup>
        <col style="width: 15%;" />
        <col style="width: 40%;"/>
        <col style="width: 5%;" />
        <col style="width: 10%;" />
        <col style="width: 10%;" />
        <col style="width: 20%;" />
    </colgroup>

Answer 1

简短答案：因为IE很烂

长答案：使用<table> ， <tr>和<td>代替。 并使用colspan属性达到相同的效果。

Answer 2

肖恩，您可以使用<td>标记来设置各种宽度的样式，正确，但是如果<colgroup>名称相对于<table>放置在正确的位置，我现在看不到您使用的代码有任何问题。 <table>标签如下：

<table style="border:1px solid #000; table-layout:fixed;">
  <colgroup>
     <col style="width: 25%;" />
     <col style="width: 65%;" />
     <col style="width: 10%;" />
  </colgroup>
  <tr>
    <th>ISBN</th>
    <th>Title</th>
    <th>Price</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>My first HTML</td>
    <td>$53</td>
  </tr>
  <tr>
    <td>5869207</td>
    <td>My first CSS</td>
    <td>$49</td>
  </tr>
</table>

IE 8显然不能与jsfiddle很好地配合，所以我将代码转储到其中的W3C沙箱中进行测试。 只需转到IE 8中的链接，并用上面的内容替换其colgroup部分，然后单击“提交代码”按钮以查看结果。

Answer 3

尽管您可能已经浏览过本网站和有关IE8的本说明 ，但是如果您再次详细阅读它们，它们将对您有所帮助。

在解析CSS时，IE8是相对不兼容的Web浏览器。

当任何人尝试进行任何大小调整（无论是窗口大小调整还是表大小调整）时，IE8中的此限制都将变得十分突出。

正如我在上面提到的一个网站中所指出的那样，您可以尝试用JavaScript补充IE8，而不是仅严重依赖HTML和CSS。