html - 指定一个元素相对于 CSS 中其他两个元素的高度

Question

我正在尝试实现这样的网站布局：http ://tzd-themes.com/gebo_admin/index.php?uid=1&page=dashboard 。

我想添加一个页脚。

页脚的工作方式如下：当您滚动到页面末尾时，有一个页脚占据了页面的所有宽度，如果需要，将侧边栏向上推，导致侧边栏缩小。所以基本上我要做的是将侧边栏的高度指定为页眉底部和页脚顶部之间的距离，使用overflow: auto;.

你可以在这里摆弄（有更多解释）：http: //jsfiddle.net/xK4B5/

Answer 1

有一个页眉、主要部分和页脚，主要部分将包含内容和侧栏。将侧边栏高度设置为 100%（如果由于某种原因不起作用，请将其绝对定位 - 左：0，上：0，下：0，右：自动）这将导致它占用你的主要空间内容是高度明智的。因此，如果您的内容很短（导致页脚出现），侧边栏也会缩短。

#sidebar {
     position:absolute;
     left:0;
     top:0;
     bottom:0;
     right:auto;
     width: 200px;
}

#content {
     margin-left: 200px;
     width: 700px;
}

应该让你接近你想要的效果。