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;
}

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