Question

我正试图让我的页脚粘在页面底部。我网站的页面高度不同。我尝试了网络上的所有内容，但没有任何效果当放大\出或调整浏览器窗口大小时，它会与浏览器进行边框并浮动在我的div，tables，..等中间这是最初的页脚css：

#footer
{
    width:100%;
    height:20px;
    vertical-align:middle;
    font-size:10px; 
    font-weight:bold;
}
#footer ul
{
    margin-top:10px;
    margin-right:10px;
    margin-left:30px;
    color: #797979;
    line-height:11px;

}
#footer ul li
{
    float:left;
    border-right:1px solid #797979;
    list-style:none;
    margin:0 5px 5px 0;
    padding-right: 5px;
}
#footer ul li a
{
    color: #797979;
    text-decoration:none;
}
#footer ul li a:hover
{
    text-decoration:underline;
}
#footer .copyright
{
        margin-top:5px;
    float:none;
        text-align:center;
}

和html看起来像：

<div id='main'>
<div id='header'>
</div>
   <form id='myform'>
     <div id='form_div'>
     </div>
   </form>
  <div id='footer'>
  </div>
</div>

这是我尝试过的所有方法：

http://www.lwis.net/journal/2008/02/08/pure-css-sticky-footer/

http://www.cssstickyfooter.com/

http://alistapart.com/article/footers

http://blog.softlayer.com/2012/tips-and-tricks-pure-css-sticky-footers/

和其他许多人......

我试着说：

#footer 
{ 
bottom:0;
position: fixed
}

它坚持这一点，但当然在调整浏览器大小时它不是似乎css中存在问题 p.s：我不是那个写它的人我只是在使用它并尝试修复它

Answer 1

尝试Ryan Fait的 sticky footer 。它非常简单，跨浏览器兼容。

调整大小时页面中浮动的粘性页脚

1 个答案: