Question

我希望表格根据其内容以最小宽度呈现，但IE7坚持将其扩展到100％宽度。

以下小片段在Firefox和IE8中运行良好，但在IE7中则不行：

<!DOCTYPE HTML>
<html>
  <head>
    <style type="text/css">
      table { table-layout: fixed  }
      td { padding: 0 10px; border: 1px solid blue;}
    </style>
  </head>
  <body>
<table>
      <tr>
        <td>Column with variable width</td>
        <td style="width: 100px;">Column 2</td>
        <td style="width: 100px;">Column 3</td>
      </tr>
    </table>
  </body>
</html>

我有一个表格布局：固定。
我已指定除第一个以外的所有单元格的宽度。
在第一列中，我希望浏览器根据内容确定宽度
由于我不知道第一列的宽度，我不能（也不想）指定表格的宽度。

现在，IE7中的问题是表格呈现为100％宽度。因此，第一个col没有显示其内容所需的最小宽度，但占用了所有空间以使表格100％宽度。

这是我到目前为止所发现的：

当我从表中删除“table-layout：fixed”时，表格不会扩展到100％。不幸的是，这对我来说不是一个选择。
当我将表格宽度设置为非常小的尺寸（例如10px）时，第一个col将不会扩展到所需的最小宽度，但会全部消失。
我试图设置“display：inline;”对于表格，但这对宽度没有影响。

有什么想法吗？

先谢谢，去核

Answer 1

如果仅table-layout: fixed的目的是修复单元格的宽度，那么您可以在DIV内添加所需宽度的TD并删除table-layout: fixed表格。

Answer 2

table-layout: fixed上的CSS specification：

使用此（快速）算法，表格的水平布局可以不依赖于细胞的内容;它只取决于 table的宽度，列的宽度以及边框或单元格间距。

所以你绝对应该通过其他方式尝试实现你需要的table-layout: fixed。

table-layout = fixed和一个没有指定width-property的col在IE7中将表宽度设置为100％

2 个答案: