显示桌高度不总是受到尊重 [英] display table height not always respected
问题描述
我有下面的代码。由于某些原因，当桌子高度小于单元格的高度时，不会考虑该高度。为什么？
I have the code below. For some reason when the table height is smaller than the height of the cells, the height is not respected. Why is that?
.table {
border: 1px solid red;
box-sizing: border-box;
display: table;
height: 15px;
}
.cell {
height: inherit;
border-width: 0;
display: table-cell;
}
.cell span {
display: inline-block;
width: 31px;
}
<body>
<div class="table">
<span class="cell">
<span>test1</span>
</span>
<span class="cell">
<span>test2</span>
</span>
</div>
</body>
推荐答案
表格单元格和表格高度只是初始建议。宽度在一定程度上发生了相同的事情。如果单词的内容不能进一步缩小宽度，则表格将逐渐适合。
Table cell and table heights are only initial recommendations. The same thing to a degree happens with width. If the content of the words can't shrink any further in width the table will grow to fit.
在表样式元素上使用时，请视为最小高度
Think of it as a min-height when used on table styled elements.
如果您希望内部的内容具有最大高度，则需要在内部的最终子跨度上设置高度和溢出等。
If you are wanting the content inside to have a maximum height you will want to set the height and overflow, etc. on the final child span inside.
这篇关于显示桌高度不总是受到尊重的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
