CSS 100％文檔高度不是觀點

Question

我無法將div擴展到文檔高度的100％（而不是觀察點高度）。我有一個導致問題的具體例子。

一個例子可以在這裏找到，（的jsfiddle的視圖窗口didnt讓我來演示該問題正確，不好意思）：

http://lavenderstone.co.uk/stackoverflow/

你會發現，如果減少以下內容高度的觀點高度（出現滾動條時）左側邊欄和內容div不再展開爲完整文檔高度 - 它們僅顯示視點的高度。

我使用％新響應式設計，所以請原諒我。我最近問了一個類似的問題，但是提出的解決方案並不適用於我的進展問題，我覺得一個新的線索會比轉移話題更重要。謝謝。

Answer 1

問題在於你沒有固定的高度，所以高度屬性並不知道高度如何達到100％。所以相反，它使用你的視口高度。

您可以使用以下CSS修復您的問題。

#pagewrap { 
    display: table; 
    height: 100%; 
} 

#menu-container { 
    height: 100%; 
} 

使用display：table;會導致你的身高：100％;要像你的視口一樣高，或者如果你的視口很小，就要像你的內容一樣高。

希望這有助於。