Html 在 <table> 中制作等宽的列
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20375288/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Make columns of equal width in <table>
提问by Michael Phelps
How do I make columns of equal width in <table>?
如何制作等宽的列<table>？
I am dynamically changing the number of columns. Today I have 13 columns. Tomorrow it will be raised to 16. I do not particularly want to recalculate.
我正在动态更改列数。今天我有13列。明天会提高到16。我也不是特别想重新计算。
回答by Adam Luniewski
I think that this will do the trick:
我认为这可以解决问题：
table{
table-layout: fixed;
width: 300px;
}
回答by Rigel Networks
Use following property same as table and its fully dynamic:
使用与 table 相同的以下属性及其完全动态：
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>May be its solve your issue.
可能是它解决了你的问题。
回答by Nitin Varpe
Found this on HTML table: keep the same width for columns
If you set the style table-layout: fixed; on your table, you can override the browser's automatic column resizing. The browser will then set column widths based on the width of cells in the first row of the table. Change your to and remove the inside of it, and then set fixed widths for the cells in .
如果你设置了样式 table-layout: fixed; 在您的表格上，您可以覆盖浏览器的自动列大小调整。然后浏览器将根据表格第一行中单元格的宽度设置列宽。将您更改为并删除它的内部，然后为 中的单元格设置固定宽度。
