Question

当高度设置为100％时，我遇到了导致滚动条的div的问题。

现在，我的网页内容看起来像;

<body>  

<hr>

<div id="content">

    <div id="heading">

    </div>

</div>


</body>

问题是HR是5px，内容是身高的100％。因此，由于它是100％的页面高度，它会低于HR并创建5px，因此我想要避免使用滚动条。

我的问题是，如果不认为它需要100％的页面高度并且不包括页面高度中的HR，我如何才能使它达到100％的高度？

感谢。

Answer 1

您可以尝试：

position: absolute;
top: 0px;
bottom: 0px;

然而，这将与HR重叠。如果您将顶部位置设置为5px，则表示不会。

Answer 2

这种布局最好使用绝对定位来完成。以下是使用HTML的示例：http://jsfiddle.net/7KGmZ/

的CSS：

#content
{
    position: absolute;
    top: 20px;
    right: 0px;
    bottom: 0px;
    left: 0px;
}

Answer 3

Answer 4

您可以设置position: absolute，然后使用top: 5px和bottom: 0;定位。

Answer 5

对我来说，问题是在页面顶部的一些元素有顶部边距，顶部填充或顶部边框，我的身体有顶部边框10px，使其成为0px后，滑动条消失了。