Question

我一直在玩我的内容以达到我想要的效果，但是现在我的页脚不会位于所有内容下面的页面底部。我现在固定在页面的底部，但是这与左侧的导航栏重叠。我将内容的主体放在div - main容器中，其中的页脚在其外部。

我的页脚的HTML：

 <div class="footer">
     <div class="footerContent">
            <p>Copyright &copy; 2014 <a href="#" title="DanielParry">www.danielparry8.com</a></p>
    </div>     
  </div>

页脚CSS：

.footer {
width: 100%;
z-index:999;
bottom:0;
clear:both;
position:fixed;

 }

  .footerContent {

font-family: sans-serif;
color: #FFF;
float:left;
width:100%;
margin-top: 10px;
margin-bottom: 10px;
 }

  .footer p {
float:left; width:100%; text-align:center;
 }

我理解固定定位可能不是使用的方法，但是当我使用其他方法时，它会向页面顶部上升，并且仍然与我的内容重叠。

所有内容都在主内容div中，并带有以下CSS

 html, body, #maincontainer { height: 100%; }
 body > maincontainer { height: auto; min-height: 100%; }

这已经让我紧张了好几天，我在这里浏览过的其他解决方案都没有用，我认为他们的代码中的错误是我无法找到的！

谢谢！

Answer 1

你需要改变位置：固定到绝对结束添加底部：0; 页脚和您的单元必须位于包装器之外

Answer 2

我在margin-bottom: <footerheight> css上使用body。可能有点“欺骗”，但似乎对我尝试的一切都有效。

如何让我的页脚粘到页面底部？

2 个答案: