如何将此容器从视口的顶部边缘扩展到底部边缘?

时间:2014-07-08 18:21:48

标签: css3 twitter-bootstrap layout

所以,我正在为我的个人网站制作我的Wordpress主题,而且我一直试图弄清楚如何做一些事情:

1)我需要将白色扩展到页面内容的上边缘

2)如果可能的话,我希望容器延伸到视口的底部边缘。

我正在使用Twitter Bootstrap来处理我的所有布局。可通过常规方式查看来源等。

我尝试在各个地方使用min-height: 100%,没有太多运气。也许它不是在正确的地方,谁知道。

提前感谢您的回复!

1 个答案:

答案 0 :(得分:1)

要将白色延伸到顶部,请从padding-top中移除.page-container,然后将其添加到page-outline。同时将height: 100%添加到page-outline

因此,对于page-containerpage-outline,您的CSS看起来像这样:

.page-container {
    min-height: 100%;
}

.page-outline {
    background-color: white;
    border-left: 1px solid black;
    border-right: 1px solid black;
    padding-top: 25px;
    height: 100%;
}