Html 我可以为 table、tr 或 td 使用最小高度吗？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19432092/
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
Can I use a min-height for table, tr or td?
提问by kilkadg
I am trying to show some details of a receive in a table.
我试图在表格中显示接收的一些细节。
I want that table to have a min height to show the products. So if there is only one product, the table would have at least some white space at the end. In the other hand if there are 5 or more products, it won't be that empty space.
我希望那个桌子有一个最小的高度来展示产品。因此，如果只有一种产品，则表格末尾至少会有一些空白。另一方面，如果有 5 个或更多产品，则不会是那个空白区域。
I have try with this css:
我试过这个css：
table,td,tr{
min-height:300px;
}
But it is not working.
但它不起作用。
Thanks in advance.
提前致谢。
采纳答案by Arnold Zak
It's not a nice solution but try it like this:
这不是一个很好的解决方案，但可以这样尝试：
<table>
<tr>
<td>
<div>Lorem</div>
</td>
</tr>
<tr>
<td>
<div>Ipsum</div>
</td>
</tr>
</table>
and set the divs to the min-height:
并将 div 设置为最小高度：
div {
min-height: 300px;
}
Hope this is what you want ...
希望这是你想要的......
回答by Aureliano Far Suau
heightfor tdworks like min-height:
height对于td像这样的作品min-height：
td {
height: 100px;
}
instead of
代替
td {
min-height: 100px;
}
Table cells will grow when the content does not fit.
当内容不适合时，表格单元格会增长。
回答by Alex Omelnitckii
The solution without divis used a pseudo element like ::afterinto first tdin row with min-height. Save your HTML clean.
解决方案 withoutdiv使用伪元素，如::afterinto first tdin row with min-height。保存您的 HTML 干净。
table tr td:first-child::after {
content: "";
display: inline-block;
vertical-align: top;
min-height: 60px;
}
回答by Sobin Augustine
In CSS 2.1, the effect of 'min-height' and 'max-height' on tables, inline tables, table cells, table rows, and row groups is undefined.
在 CSS 2.1 中，'min-height' 和 'max-height' 对表格、内联表格、表格单元格、表格行和行组的影响是未定义的。
So try wrapping the content in a div, and give the div a min-heightjsFiddle here
所以尝试将内容包装在一个 div 中，并在此处给 div 一个min-heightjsFiddle
<table cellspacing="0" cellpadding="0" border="0" style="width:300px">
<tbody>
<tr>
<td>
<div style="min-height: 100px; background-color: #ccc">
Hello World !
</div>
</td>
<td>
<div style="min-height: 100px; background-color: #f00">
Goog MOrning !
</div>
</td>
</tr>
</tbody>
</table>
回答by frank
if you set style="height:100px;" on a td if the td has content that grows the cell more than that, it will do so no need for min height on a td.
如果你设置 style="height:100px;" 在 td 上，如果 td 的内容使单元格增长更多，则不需要 td 上的最小高度。
回答by Agu Dondo
Tables and table cells don't use the min-heightproperty, setting their heightwill be the min-height as tables will expand if the content stretches them.
表格和表格单元格不使用该min-height属性，将它们设置height为最小高度，因为如果内容拉伸它们，表格将扩展。
回答by Sacky San
Simply use the css entry of min-height to one of the cells of your table row. Works on old browsers too.
只需将 min-height 的 css 条目用于表格行的单元格之一。也适用于旧浏览器。
.rowNumberColumn {
background-color: #e6e6e6;
min-height: 22;
}
<table width="100%" cellspacing="0" class="htmlgrid-table">
<tr id="tr_0">
<td width="3%" align="center" class="readOnlyCell rowNumberColumn">1</td>
<td align="left" width="40%" id="td_0_0" class="readOnlyCell gContentSection">411978430-Intimate:Ruby:Small</td>
