jquery - 粘性页脚将内容推送到页面下方

Question

我试图从这里设置粘性页脚

这是 jsfiddle http://jsfiddle.net/pbhE8/

还有我的网站：http: //22twenty.com/Test

如您所见，页脚被推到内容的基础之外。

我不能再发布链接了，但我相信你可以从发布的网站上获取 css，以及你可能需要的任何其他内容。

希望有人可以帮助

丹佛

Answer 1

我假设您想要做的是让页脚 div 贴在页面底部，但不与页面中间的任何内容重叠。我以前没有使用过“粘性页脚”，但我已经在几个网站上这样做了，这就是我所做的（实际上来自几周前我在这里提出的一个问题。

创建一个<div>围绕整个网站内容的内容。将此 div 的 css 设置为：

#wrapper {
min-height: 100%;
width: 100%;
position: absolute;
}

为页面中间创建一个内容 div，您的网站的主要内容将与 css 一起使用：

#maincontent {
width: 'some width';
height: 'some height';
margin-bottom: 'the height of the footer'
overflow: auto;
}

然后将您的页脚 div 嵌入到带有 css 的“底部”div 中：

#bottom {
width: 100%;
position: absolute;
bottom: 0;
}

然后，只要主要内容 div 的边距与页脚 div 的高度相同，它们就不会重叠，但页脚将位于“底部”div 内，该 div 被“卡”在浏览器窗口的底部。

希望这有助于让我知道您是否有任何问题或需要进一步的帮助。