Html 侧边栏高度为'；t随内容高度而变化

这就是侧边栏在“开始阶段”的样子：

当内容符合原始页面大小时没有问题：

但是，一旦列彼此放置在一起，侧边栏的高度将保持不变，在底部留下空白：

侧栏位于包裹内：

#wrap {width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0}
.sidebar {width: 200px; height: 100%; float: left; background: #65A973; position: relative; bottom: 0px}

一些html

    <div id='wrap'>
        <div class='sideBar'>
           //something goes here 
        </div>
        <div id='content'>
           //something goes here 
        </div>
        <div class='clear'></div>
    </div>

//这里有些东西
//这里有些东西

添加这些属性

.sidebar{
  width: 200px;
  height: 100%;
  position:fixed;
  display:block;
  top: 0;
  }

---

当右柱较高时，您希望柱具有100%的高度可展开。您面临这个问题，因为您的100%高度是指视口，而不是实际的DIV高度

只有在左列中使用

position:absolute

才能实现这一点（使用填充内容进行正确对齐）

---

为了将我的评论正式化为答案：

我建议使用

位置：固定：

#sidebar {
    position:fixed;
    top:0;
    bottom:0;
    left:0;
    width:[some width];
}

#contents {
    margin-left:[sidebar width + normal margin];
}

现在请确保增加其余内容的边距，以便它们不会消失在侧边栏后面：

#sidebar {
    position:fixed;
    top:0;
    bottom:0;
    left:0;
    width:[some width];
}

#contents {
    margin-left:[sidebar width + normal margin];
}

请注意，您现在不能再在侧边栏内滚动，但页面其余部分的滚动保持不变。
请发布最小html代码或JSFIDDLE当您获得滚动条时是否会出现此问题？如果是这样，则您的高度100%是相对于主体的&要使其相对于内容div，您必须使用表格单元格布局。@ImranBughio，的确在所有设备上，包括iPhone4和5，但不是iPad或iphone6与
top组合：0；左：0；底部：0？这将确保它始终从上到下延伸。不要忘记应用
左边距：[正常边距+边栏宽度]到右侧的实际内容。另外请注意，这个解决方案将不允许在侧边栏（但不允许在页面的其余部分）中滚动。这实际上是一个很好的主意。但是，请添加一个
溢出：auto