0

我在具有页眉、内容、“粘性”页脚和侧边栏的网站布局上遇到了一些问题。粘性页脚、页眉和内容组合本身不是问题,但我一生都无法弄清楚如何添加一个从页眉一直到页脚的侧边栏,而不会弄乱“粘性”页脚。

我现在接近它的方式涉及绝对定位。我基本上制作了一个页眉 div ( height: 71px; top: 0px;)、一个页脚 div ( bottom: 0px; height: 30px;) 和一个内容 div ( top:71px;bottom:30px;)。然后,我将侧边栏向左浮动到内容 div 内并使其高度为 100%,并在其旁边添加另一个 div(称为“视图”)以用于实际站点内容。这样可以确保侧边栏从上到下很好,并且页脚通常位于页面底部。

但是,当调整窗口大小时,这种方法会出现问题,尤其是当内容太大而无法放入“视图” div 本身时。这会导致页脚截断内容,向下滚动会使页脚在窗口中向上移动。我想实现一个这样的页脚但也有一个侧边栏,它总是从页眉延伸到页面的页脚。

如果有人能想到一种在上面链接的页面上添加这样一个侧边栏的方法,或者对我如何解决这个问题有任何想法,将不胜感激。预先感谢。

4

2 回答 2

1

您认为除了 div 高度和定位之外,您还可以发布一些示例 HTML 和 CSS 吗?

我在想的是你可以<div>在侧边栏中扔另一个<div>并将 margin-bottom 或 padding-bottom 设置为30px. 我会为你开发一个 jsFiddle。

于 2012-04-28T05:09:20.707 回答
0

您始终可以overflow: auto在视图 div 上放置一个。

http://jsfiddle.net/dzRZd/

编辑:

改为固定定位:http: //jsfiddle.net/ekSvQ/2/

于 2012-04-28T05:29:52.433 回答