在<table>中创建宽度相等的列

Question

如何制作宽度相等的列？

动态更改列数.

今天我有13列.明天将参加比赛16.所有人都不想特别重新计算.

Answer 1

我认为这样做可以解决问题:

table{
    table-layout: fixed;
    width: 300px;
}

Answer 2

使用与表相同的以下属性及其完全动态:

ul {
    width: 100%;
    display: table;
    table-layout: fixed; /* optional, for equal spacing */
    border-collapse: collapse;
}
li {
    display: table-cell;
    text-align: center;
    border: 1px solid pink;
    vertical-align: middle;
}

<ul>
  <li>foo<br>foo</li>
  <li>barbarbarbarbar</li>
  <li>baz klxjgkldjklg </li>
  <li>baz</li>
  <li>baz lds.jklklds</li>
</ul>

可能是它解决了你的问题.

Answer 3

在HTML表格上找到它:为列保持相同的宽度

如果你设置样式table-layout:fixed; 在您的桌面上,您可以覆盖浏览器的自动列大小调整.然后,浏览器将根据表格第一行中单元格的宽度设置列宽.更改您的内部并删除它的内部,然后为其中的单元格设置固定的宽度.