小编Acc*_*ate的帖子

CSS Layout Help - 将div拉伸到页面底部

我正在尝试创建一个带有"标题"区域的布局,其中包含徽标和一些链接,然后是一个需要扩展到页面底部的内容区域.这是我陷入困境的地方.

我用一个高度为100%的容器div包围了标题和内容,这很好用.但我不能让内容div延伸到容器div的底部,因为给它一个100%的最小高度似乎从页面主体获取高度,所以我最终得到一个滚动条由于空间由标题占据页面顶部.

这是一个线框,希望能让我想要的更清晰......

小样

这是一个快速的CSS示例,这是有效的,除了总是有一个滚动条,其中看起来是标题区域的高度...

html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    color: #fff;
}
body {
    background-color: #000;
}
#container {
    position: relative;
    margin: 0 auto;
    width: 1000px;
    min-height: 100%;
}
#header {
    padding-top: 26px;
}
#logo {
    width: 194px;
    height: 55px;
    margin: 0 auto;
    background-color: #fff;
}
#content {
    margin-top: 10px;
    position: absolute;
    width: 1000px;
    min-height: 100%;
    background-color: #fff;
}
Run Code Online (Sandbox Code Playgroud)

html css

16
推荐指数
1
解决办法
4万
查看次数

标签 统计

css ×1

html ×1