容器DIV不拉伸超出窗口

我使用HTML和身體設置爲100％的高度容器DIV下面的CSS的原始高度，但它不伸展出窗口的邊緣上this page，即向上滾動揭示的內容下下來的頁面時，容器DIV沒有顯示：容器DIV不拉伸超出窗口

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

可能有人請讓我知道爲什麼這是行不通的。

來源

2011-12-12 Nick

你要麼需要一個'明確補充：both'元素的'＃content'底部，或添加'溢出：汽車;'的'＃container'樣式塊。（請注意，您可以添加'溢出：auto'到'.container'，但你必須處理滾動條;同時，在'＃container'修復也不是完美的，因爲'浮動：right'箱不擴大'＃content'低於它的底部。） –

@JaredFarrish，你應該做的是一個答案。 – FakeRainBrigand

實際上，在'＃容器'樣式定義中添加'overflow：hidden'可以解決這個問題。 –

添加overflow: hidden到：

#container { 
    overflow: hidden; /* Right here */ 
    background-color: #292929; 
    margin-bottom: 0; 
    margin-left: auto; 
    margin-right: auto; 
    margin-top: 0; 
    min-height: 100%; 
    padding-bottom: 0; 
    padding-left: 0; 
    padding-right: 0; 
    padding-top: 0; 
    width: 1200px; 
}

這將導致#container流過底部的浮動元素，應該給它它的計算高度。另一種選擇是做一個.clearfix。

來源

2011-12-12 23:51:26

謝謝，它解決了容器問題。由於某些原因，側欄現在在底部被切斷。可能與你的答案無關，但如果你有任何線索，爲什麼發生這種情況，我會很高興聽到他們！ – Nick

您可以將'padding-bottom'定義添加到'＃container'和'＃sidebar'。它看起來像'35px'和'20px'分別會很好。 –

再次感謝Jared。這工作正常。享受你的一天/晚上。 – Nick

-2

你應該使用的高度，而不是寬度：

height: 1200px;

相反的：

width: 1200px;

來源

2011-12-12 23:40:34 ricardordz

我不知道你會得到從這個想法，但是這並不是什麼問題。 –

我不認爲這就是他正在尋找 – 1ftw1

對不起，是我不好在那一個！ – ricardordz

容器DIV不拉伸超出窗口

回答

相關問題