4

我的网站有两列，现在背景颜色在左列的最后一段内容处结束（用于导航）。

我试过 height:100%, min-height:100%; 等似乎不起作用。这是CSS。

.container {
    width: 100%;
    height:100%;
    min-width: 960px;
    background: #fbf6f0;
    margin: 0 auto; 
    overflow: hidden;
}

#sidebar1 {
    float: left;
    position:absolute;
    width: 20%;
    height:100%;
    min-width:220px;
    background: none repeat scroll 0% 0% #007cb8;
    z-index:9999;
}
4

4 回答 4

8

使用视口高度 - vh。

.container {
height: 100vh;
}

更新

请注意，在 Safari iOS 上使用 VH 存在潜在问题。有关更多信息，请参阅此线程：Chrome / Safari notfill 100% height of flex parent

于 2014-06-29T05:25:19.210 回答
5

也设置身体高度

body,html{
  height:100%;
}

div {
  height:100%
}
于 2013-04-11T18:35:16.937 回答
0

div默认情况下它不会填满整个窗口的原因是因为它是父标签，所以<body>标签可能只会拉伸到它需要的高度。在样式表的顶部添加这个（我喜欢以与标记中的标签类似的顺序对样式进行排序）：

html, body {
    height:100%;
    min-height:100%;
}

编辑：语法

于 2013-04-11T18:36:24.790 回答
0 
overflow-y: auto;

此 CSS 代码适用于您的解决方案。

于 2013-11-28T20:32:08.243 回答