我有一个可滚动的基本表.这样做我必须设置thead和tbody display：block并且我还设置了th和td的宽度.
由于某种原因,第一列不与第一列tds对齐.
谁能告诉我是什么原因导致的？
CSS
thead,tbody {
display: block;
}
thead {
text-align: left;
}
tbody {
background: yellow;
overflow-y: auto;
height: 6em;
}
thead th,tbody td {
width: 4em;
padding: 2px;
}
thead tr th:first-child,tbody tr td:first-child {
width: 8em;
background: salmon;
font-weight: normal;
}
这是Fiddle
解决方法
DIV& amp;宽度的宽度表格的工作方式不同.
使用max-width& min-width实现您想要的结果：
thead tr th:first-child,tbody tr td:first-child {
width: 8em;
min-width: 8em;
max-width: 8em;
word-break: break-all;
}
编辑：
(编辑答案澄清HTML中宽度的工作,请指出我是否出错或错过了什么！)
在div width属性中用于定义元素的大小&无论父母与否,内容都是相应的.兄弟宽度.
但是在表的情况下,元素的大小根据内容计算,& width属性的优先级较低.甚至考虑兄弟姐妹的大小.因此,我们必须使用其他属性,如min-width& max-width强制我们想要的尺寸！