如何将容器DIV的高度设置为窗口高度的100％？

Question

我的容器DIV有几个问题。对于其中一个，它不能正确识别我的内容的高度（我认为它会超出主内容和侧边栏的底部，但事实并非如此）。你可以看到我的意思是this page。

我还希望容器DIV始终填充屏幕/窗口的可用高度。我试图将其设置为min-height:100%，但这没有任何影响。

这里是我使用的容器DIV的CSS：

#container { 
    padding: 0; 
    margin: 0; 
    background-color: #292929; 
    width: 1200px; 
    margin: 0 auto; 
    min-height: 100%; 
} 

我将是任何帮助得到这个工作表示感谢。

感谢，

尼克

Answer 1

添加到您的CSS：

html, body { 
    height:100%; 
} 

如果说身高：100％，你的意思是 '父元素的100％'。如果父元素没有指定高度，则不会发生任何事情。你只在身上设置100％，但你也需要将它添加到HTML。

Answer 2

你有没有设置CSS：

html, body 
{ 
    height: 100%; 
} 

您需要这是能够使格采取了所有空间。 :)

Answer 3

可以净设置它来查看高度

html, body 
{ 
    height: 100vh; 
} 

Answer 4

html { 
    min-height: 100%; 
} 

body { 
    min-height: 100vh; 
} 

的html height (%)将采取的height文件的高度的关心超过了screen view的100%而body view height (vh)将采取小心文档的高度小于屏幕视图的高度。