如何將容器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)將採取小心文檔的高度小於屏幕視圖的高度。