如何设置固定位置元素高度到达浏览器窗口底部？

Question

我的页面顶部有标题,左侧是侧边栏,右侧是主要内容区域.可以在http://jsbin.com/iqibew/3上看到简化版本.

侧边栏具有样式,position: fixed因此它不会与页面的其余部分一起滚动.这有效,但如果内容太长而无法适应,我还需要侧边栏本身滚动.

只有在我可以为侧边栏设置正确的高度时才可以这样做.但我找不到任何方法来设定这个高度.100%接近,但它太高了,因为侧边栏从标题下面开始.

没有办法解决这个问题.我对CSS或JavaScript/jQuery解决方案持开放态度.

Answer 1

我想我会发布这个,因为它似乎有效:

div#header-div {
    height: 90px;
    background-color: lime;
    margin: 0;
}
div#fixed-div {
    position: fixed;
    left: 0;
    top: 0;            /* <<< No offset */
    bottom: 0;         /* <<< Pull to the bottom for height */
    margin: 120px 0 0; /* <<< Give it the 120px top */
    width: 260px;
    background-color: silver;
    overflow-y: scroll;
}

http://jsbin.com/iqibew/13/