css - CSS将宽度保持为百分比不取决于内容宽度

Question

我是 CSS 新手，必须从其他人那里修改一些复杂的代码。我想要的很简单，三个带边框的s在一个表格中，每个都有33%的宽度FIXED，我不希望这些s的宽度随着内容宽度的变化而跳来跳去，我想要一个水平滚动条如果它的内容太宽（比如一个单词太宽而没有空格）。

我尝试了类似的方法但不起作用，有什么线索吗？谢谢！

<table>
  <tr>
    <td style="width: 34%; max-width: 34%; overflow: auto">abc</td>
    <td style="width: 33%; max-width: 33%; overflow: auto">efg</td>
    <td style="width: 33%; max-width: 33%; overflow: auto">xyz</td>
  </tr>
</table>

Answer 1

您需要为表设置固定。

编辑： colgroup 是正确的标签

<table style="table-layout:fixed;width:1000px;overflow-x:auto;">
<colgroup>
  <col width="34%">
  <col width="33%">
  <col width="33%">
</colgroup>
  <tr>
    <td>abc</td>
    <td>efg</td>
    <td>xyz</td>
  </tr>
</table>