Question

我有以下HTML示例（下面），它应该覆盖整个页面，填充可用区域的大黄色div。它在div中没有太多内容并且页面从上到下覆盖黄色时工作正常，但是当您通过填充div加载文本或其他内容来显示垂直滚动条时，底部会出现白色间隙。有没有人知道为什么会出现这个空白以及如何使用CSS或Javascript来摆脱它？

我应该补充一点，我已尝试添加负边距和底部值，但他们只是将空白区域向下推，而不是删除它们。

我正在使用Firefox 32，这可能会有帮助。

感谢您的帮助。

<html>
<head>
<style>
#f {
    bottom: 0px;
    top: 0px;
    left: 0px;
    right: 0px;
    position: absolute;
    display: block;
    background: yellow;
}
</style>
<body>
<div id='f'>
... lots of text here from ipsum ...
</div>
</body>
</html>

Answer 1

删除“position：absolute;”。它解决了你的问题。

Answer 2

使用这个有效的CSS

body{
        margin: 0 0 0 0;
    }
    #f {

        height:auto;
        right: 0px;
        display: block;
        position:absolute;
        background: yellow;
    }

在#f中删除左上角和右上角并在正文中添加边距0 0 0 0

边框设置为0时，页面底部出现空格

2 个答案: