Question

嗯，这是我在这里的第一篇文章，非常喜欢这个网站。

我有一个非常基本的（丑陋的）罪恶网站，我已经开始出于某些原因，我无法让CSS Sticky页脚为FireFox工作。 IE工作正常，但FF显示它在页面的中间位置。

网址为http://dev.aipoker.co.uk

我知道我应该在FF中进行开发并在IE中进行错误修复，所以我猜我可能实际上犯了一个错误，并且它在某种程度上适用于IE但在其他任何地方都没有。

任何人都可以帮助我摆脱痛苦吗？

谢谢，伙计们和加尔斯。

Answer 1

我已经成功使用了这样的代码：

footer { 
  display: block; 
  position: absolute; 
  width: 100%; 
  bottom: 0px; 
}

Answer 2

试试这个one，它适用于Firefox。

顺便说一句，如果你还没有，你应该听听Boagworld的播客。这个棒极了！：）

干杯。

Answer 3

我能看到的最小变化是：

在身体内移动footerSection
在body和footerSection上设置绝对位置
在footerSection上设置bottom = 0px

最终会出现这样的事情：

<style type="text/css">
  #body, #footerSection { position: absolute; }
  #footerSection { bottom: 0px; }
</style>

<div id="body">
   ...
   <div id="footerSection">
      ...
   </div>
</div>

Answer 4

所有你需要知道的关于css只有粘性页脚＆amp;粘性导航：

坚持到页面底部

Position: absolute;
top:auto;
bottom: 0;

坚持屏幕底部

Position: fixed;
top:auto;
bottom:0;

任何问题都可能是由于您放置了html代码的位置（除非它粘贴到内容包装器上，否则不要使页脚成为子元素），或者重叠CSS。

您可以通过翻转自动＆amp; amp;来将相同的技术应用于粘性导航。最佳。它是跨浏览器兼容的（来自IE7及以上的内存），包括手机。

无法获得CSS Sticky页脚工作。我究竟做错了什么？

4 个答案: