如何将高度设置为页面的100％？

Question

我想从上到下一直扩展我的div甚至认为我的div中没有​​足够的元素。

我设置了CSS

#content{
    margin-top: 10px;
    padding: 15px;
    display:block;
    height:100%
    background-color:red;
}

我的HTML

<div id='content'>
    just a little bit of contents here.
</div>

我希望从页面的顶部到底部一直看到红色背景。

我该怎么做？

非常感谢

Answer 1

您可以通过添加此CSS代码来使其工作：

html, body {
    height: 100%;
}

<强> jsFiddle demo.

Answer 2

#content {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: red;
}

Answer 3

将此添加到您的内容div，工作一个款待！

height: 100vh;