Question

确定，所以这是我的问题..而且它有一段时间我的错误... 我需要在此TD中设置以下DIV 100％高度，没有任何副作用（我的意思是滚动），因为由于某些未知原因，当我将其设置为100％高度时，看起来像IE 8做了一些错误的计算。。我尝试了很多组合但没有成功.. 过渡性doctype是必需的...... 提前感谢您的帮助！

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<style>
html, body
{
    height:100%;
    margin:0px;
    padding:0px;
}
</style>
<head>
    <body>
        <table style="height:100%" border="1">
            <tr>
                <td>TOP</td>
            </tr>
            <tr style="height:100%">
                <td style="height:100%">
                    <div style="border:1px dotted blue; height:100%">CONTENT</div>
                </td>
            </tr>
        </table>
    </body>
</html>

Answer 1

div上的边框是高度的“外部”......所以，你应用的样式是100％+ 2px的高度（1px顶部边框，1px底部边框）......

如果你删除边框，真正的高度将是100％，滚动条应该消失:)

如下所述，底部单元格中的height:100%使总表高度=第一行高度+底行高度的100％。

更新：好吧，所以它不漂亮，但它是我所拥有的最好的：

如果你给div一个id blah并使用下面的jquery来破解div的高度到它的父亲的那个...这需要第一行/单元格的高度定义虽然..我设置为100px为例。

$('#blah').height($('#blah').parent().height());

jsfiddle example ... http://jsfiddle.net/Damien_at_SF/vwcvN/

Answer 2

你应该看一下css box模型的基础。例如：http://www.w3.org/TR/CSS21/box.html

100％高度div在100％td内

2 个答案: