指定元素相对于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;
}

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