css页脚位置坚持浏览器底部？

Question

我的网站有问题http://artygirl.co.uk/pixie/about/我似乎无法让页脚自动粘到浏览器的底部,并显示我的其余背景.有没有比使用位置更好的解决方案:固定还是绝对？

我认为可能有其他风格超过我在firebug中做的一些测试.

感谢您的帮助,关心Judi

Answer 1

CSS:

.podbar {
    bottom:0;
    position:fixed;
    z-index:150;
    _position:absolute;
    _top:expression(eval(document.documentElement.scrollTop+
        (document.documentElement.clientHeight-this.offsetHeight)));
    height:35px;
}

HTML:

<div class="podbar">
    Put your footer here
</div>

这将创建一个始终显示在页面底部并覆盖所有内容的粘性.只需在主容器div的底部添加额外的边距/填充,等于页脚的高度,+5px这样就不会覆盖您的内容.

适用于我测试过的几乎所有浏览器.

Answer 2

我之前使用过本文中的技术:CSS布局:页眉和页脚的高度为100%.它确实需要HTML中的一些额外标记.

Answer 3

这总是有点困难，您可以增加min-height内容区域的面积，但是即使这样，即使有人的屏幕非常大，您也会看到相同的东西。

min-height如果某人具有较大的视口，则可以使用一些JavaScript来增加，但这仍然不够优雅。我不确定是否有仅CSS的解决方案。

如果您想尝试上面的代码，我刚刚在这里发布：使用jQuery检测滚动条是否仍然很困难？可能对您有用。