Fiddle

Question

我已经阅读了有关如何在页面底部制作页脚的所有教程，但我仍然无法为我的网站执行此操作。

我提到的链接是

没有一个工作..！

CSS

#footer1 {
clear: both;
background-color: #333;
width: 1200px;
min-width: 100%;
width: 100%;
bottom: 0;
position: relative;
height: 50px;
border-top:5px solid #1b9bff;
}

这是我网站的虚假小提琴

Fiddle

这是我尝试的小提琴，但它也有一个错误

http://jsfiddle.net/andresilich/fVpp2/1/

Answer 1

试试这个：

<div id="container">
  <div id="content"></div>
</div>
<div id="footer">My Sticky Footer</div>

CSS：

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

#footer {
   clear: both;
   position: relative;
   z-index: 10;
   height: 3em;
   margin-top: -3em;
}

#content { padding-bottom: 3em; }

Answer 2

添加/编辑如下

#body {
margin-bottom: 85px;
position: relative;
}

#footer1 {
position: fixed;
}

我猜这就是你想要的

* html #form1 {
    height:100%; 
}

#form1 {
    min-height: 100%;
    position: relative;
}

#body {
    padding-bottom: 50px; /* padding-bottom should be equal to the footer height (this keeps the footer from overlapping the content) */
}

#footer1 {
    position: absolute;
    width: 100%;
    clear: both;
    bottom: 0;
    padding: 0;
    margin: 0;
}

Answer 3

遵循this method的代码 - 您需要：

1）将您的页脚放在表单

之外

2）在表格上添加高度：100％

3）根据页脚的高度设置负底边距。

form {
    min-height: 100%;
    height: 100%;
    margin: 0 auto -150px; /*footer 150px high */
}

<强> Modified Fiddle

如何使页脚粘贴到页面底部

Fiddle

3 个答案: