jquery - 设置边栏高度以匹配容器

我有一个布局，其中容器包含一个侧边栏。我需要边栏与容器高度完全相同。请参见this site，其中边栏为#leftbar，容器为#container

如果您查看该站点，您将明白我的意思。我要么需要一个纯CSS解决方案，要么一个jQuery解决方案。

要记住的重要事项导航是垂直手风琴，因此，当单击某些按钮时，侧栏#leftbar将垂直扩展。该解决方案需要适应增长，因此仅使用jquery匹配其高度并不是可行的解决方案。

最佳答案

将以下属性添加到这些元素：

#cotainer {
    position: relative
}

#leftbar {
    position: absolute;
    top: 0;
    bottom: 0;
}

#righthome {
    margin-left: 270px; /* looks to be about the width of the leftbar */
}

赋予属性#leftbar显示，将确保顶部与position: relative保持在下一个父元素的顶部，底部边缘保持相同。

但是，这有副作用。 #righthome元素成为其父盒布局模型中的第一件事，因此与左栏重叠。为了解决这个问题，您给它留了一个左边距，可以将其放回原处。