等大小的表格单元格，用于填充包含表格的整个宽度

Question

是否有办法使用HTML / CSS（具有相对大小）来使一行单元格拉伸包含它的表格的整个宽度？

单元格的宽度应相等，外部表格大小也是<table width="100%">的动态。

目前，如果我没有指定固定大小;细胞只是自动调整以适应它们的内容。

Answer 1

您甚至不必为单元格设置特定宽度，table-layout: fixed足以均匀地展开单元格。请参阅此jsfiddle，在IE8上测试。

  

请注意，要使table-layout正常工作，表格样式元素必须设置宽度（在我的示例中为100％）。

Answer 2

只需使用百分比宽度和fixed table layout：

<table>
<tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
</tr>
</table>

与

table { table-layout: fixed; }
td { width: 33%; }

固定的表格布局很重要，否则如果内容不合适，浏览器会根据需要调整宽度，否则宽度不是没有固定表格布局的规则。

显然，调整CSS以适应您的情况，这通常意味着仅将样式应用于具有给定类或可能具有给定ID的表。

Answer 3

使用table-layout: fixed作为table和width: calc(100%/3);的{​​{1}}属性（假设有3 td个） 。设置这两个属性后，表格单元格的大小将相等。

请参阅demo。

Answer 4

只需将此行添加到您的表格样式中即可：

#table_name{
    table-layout: fixed;
    width: 100%;
}

你在这个 codepan 上有一个很好的例子。

这是迟到的答案，但它将有助于未来的搜索。