min-height and table cells

问题

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?

回答1:

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

回答2:

from: 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.

from: 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.

来源：https://stackoverflow.com/questions/9858040/min-height-and-table-cells

标签

css

cross-browser

cell

css-tables