容器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不拉伸超出窗口

回答

相关问题