CSS 最小高度和表格单元格
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/9858040/
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
min-height and table cells
提问by That Guy
I've done a little bit of research on this, but I just wanted to ask to people who'd know much better than I.
我对此做了一些研究,但我只是想问问比我更了解的人。
Is it true that setting a height to a table cell only acts as min-height? I know this is true in Firefox, but what other browsers does this happen in?
为表格单元格设置高度是否仅用作最小高度?我知道这在 Firefox 中是正确的,但是在其他哪些浏览器中会发生这种情况?
回答by Zmogas
Short answer: YES. I tried to load following code:
简短的回答:是的。我尝试加载以下代码:
<table border="0" style="background-color: yellow;">
<tr style="background-color: green;">
<td>row 0 cell 0</td>
<td>row 0 cell 1</td>
</tr>
<tr style="background-color: green;">
<td height="50">row 1 cell 0</td>
<td>row 1 cell 1</td>
</tr>
<tr style="background-color: green;">
<td style="height: 50px;">row 2 cell 0</td>
<td>row 2 cell 1</td>
</tr>
</table>
Both (height and style) work the same in browsers I tried:
两者(高度和样式)在我尝试过的浏览器中的工作方式相同:
- Linux
- Google chrome 19.0
- Firefox 13.0
- Konqueror 4.8
- Windows
- Google chrome 19.0
- Firefox 12.0 and 13.0
- Internet explorer 8
- Android 2.3.3
- Linux
- 谷歌浏览器 19.0
- 火狐 13.0
- 征服者 4.8
- 视窗
- 谷歌浏览器 19.0
- 火狐 12.0 和 13.0
- 互联网浏览器 8
- 安卓 2.3.3
回答by Adam Tolley
from: http://www.w3.org/TR/CSS21/visudet.html#propdef-max-height
来自:http: //www.w3.org/TR/CSS21/visudet.html#propdef-max-height
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' 对表格、内联表格、表格单元格、表格行和行组的影响是未定义的。
from: http://www.w3.org/TR/CSS21/tables.html#height-layout
来自:http: //www.w3.org/TR/CSS21/tables.html#height-layout
The height of a 'table-row' element's box is calculated once the user agent has all the cells in the row available: it is the maximum of the row's computed 'height', the computed 'height' of each cell in the row, and the minimum height (MIN) required by the cells. A 'height' value of 'auto' for a 'table-row' means the row height used for layout is MIN. MIN depends on cell box heights and cell box alignment (much like the calculation of a line box height). CSS 2.1 does not define how the height of table cells and table rows is calculated when their height is specified using percentage values. CSS 2.1 does not define the meaning of 'height' on row groups.
In CSS 2.1, the height of a cell box is the minimum height required by the content. The table cell's 'height' property can influence the height of the row (see above), but it does not increase the height of the cell box.
'table-row' 元素框的高度在用户代理拥有行中所有可用单元格后计算:它是该行计算的“高度”的最大值,该行中每个单元格的计算“高度”,和单元格所需的最小高度 (MIN)。'table-row' 的 'auto' 的 'height' 值意味着用于布局的行高为 MIN。MIN 取决于单元格框高度和单元格框对齐方式(很像行框高度的计算)。当使用百分比值指定高度时,CSS 2.1 没有定义表格单元格和表格行的高度是如何计算的。CSS 2.1 没有定义行组上“高度”的含义。
在 CSS 2.1 中,单元格框的高度是内容所需的最小高度。表格单元格的“高度”属性可以影响行的高度(见上文),但不会增加单元格框的高度。