html - 使单元格保持 10% 宽

Question

我有一个 10% 宽的单元格，里面有几个词。当您缩小窗口大小时，大小会不断变小，直到它与内部文本的长度相匹配，然后停止缩小。我希望它保持在精确的 10% 宽。我该怎么做呢？

抱歉，不能选择使用 div。

Answer 1

这可能会奏效：

#your_table {
  table-layout: fixed;
}

表格可以（应该，因为这取决于浏览器来实现）有两种类型的布局：

1. table-layout: fixed：这是“愚蠢”的表格布局。该表不关心其内容，只是粗心地调整大小。
2. table-layout: auto：这是“智能”表格布局。该表格关心它的内容，一旦达到单元格的最小宽度和高度，就会停止调整单元格的大小。这是默认表行为。

谢谢 W3C：http ://www.w3.org/TR/CSS2/tables.html#propdef-table-layout

Answer 2

看起来你真正想要的是一个固定的宽度。如果您说表格必须为 300px，则可以指定单元格始终为 30px。相对规模是导致问题的原因。

table.myClass{
    width: 300px;
}

table.myClass td.myOtherClass{
    width: 10%;
}