Question

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

我尝试过身高：100％，身高：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;
}

Answer 1

使用视口高度 - vh。

.container {
height: 100vh;
}

<强>更新

请注意，在Safari iOS上使用VH可能存在问题。有关详细信息，请参阅此主题：Chrome / Safari not filling 100% height of flex parent

Answer 2

设置身高

body,html{
  height:100%;
}

div {
  height:100%
}

Answer 3

div默认情况下没有填满整个窗口的原因是因为它的父级可能是<body>标签，只能伸展到需要的高度。在样式表的顶部添加它（我喜欢按照与标记中的标记类似的顺序排序样式）：

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

编辑：语法

Answer 4

overflow-y: auto;

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

div为浏览器窗口的100％高度

4 个答案: