展开div全高度

Question

我想将黑盒子（id：column-content）展开到没有滚动条的整个高度。

我尝试了很多东西，但没有任何作用。

以下是网址：http://goo.gl/I5f0u59

有什么想法吗？感谢。

Answer 1

#column-content {
  bottom:0;
  position:fixed;
  top:0;
}

Answer 2

您可以使用viewport units vh和vw（视口高度和视口宽度）

在你的情况下：

#column-content
{
    height: 100vh;
    box-sizing: border-box;
    /* 
    change width, since we use border-box
    old width + padding
    */
    width: 480px; 
}

如您所见，这会使您的列内容box-sizing:border-box因为填充顶部和底部而阻止容器变得大于100vh。内容仍然可能导致溢出。您还必须设置一个新的宽度，如上所示。

对此用例的支持是正确的See here