您甚至不必为单元格设置特定的宽度,table-layout: fixed
足以均匀地分布单元格。
ul {
width: 100%;
display: table;
table-layout: fixed;
border-collapse: collapse;
}
li {
display: table-cell;
text-align: center;
border: 1px solid hotpink;
vertical-align: middle;
word-wrap: break-word;
}
<ul>
<li>foo<br>foo</li>
<li>barbarbarbarbar</li>
<li>baz</li>
</ul>
请注意,table-layout
要使用表格样式的元素,必须设置宽度(在我的示例中为100%)。