Html 页脚

我已经看过多个答案，但由于某种原因，我无法让它们中的任何一个起作用。我试图有我的网站的页脚在页面的最底部没有任何空间放在它下面

现在只有索引和关于页面被打开了

我是一名学生，所以我知道我的代码不是最好的，但我正在努力

我的CSS：

html {
height: 100%;}

#wrapper {
position:relative;
background: #fff;
width: 990px;
min-height:100%;
margin: auto;}

footer {
clear: both;
height: 175px;
width: 990px;
background: #005959;
position: absolute;
bottom: 0px;
left: 0px;}

---

我的HTML是一个基本的包装器、页眉、内容和页脚。

只需将其添加到css中即可：

#footer {
    width:100%;
    height:80px;
    position:absolute;
    bottom:0;
    left:0;
    background:#ee5;
}

---

下面是一个包含上述代码的JSFIDLE:

因为您已将

设置为相对，所以页脚将根据它定位

---

将页脚从

标记中取出，或从

部分

标记中删除相对位置。问题是父容器充当包装器，其高度基本上为0。因此，当您将页脚完全定位到底部时，它将定位到该包装的底部，该包装位于页面的顶部，因为它没有高度。您可以浮动页脚，它将显示在下面。在页脚上尝试以下更正的CSS：

footer {
    float: left;
    width: 100%;
    clear: both;
    height: 175px;
    width: 990px;
    background: #005959;
}

编辑：

如果浮动所有内部容器，则会将页脚强制到底部：

header,
img#slideshow,
section#mainContent,
footer {
     float:left;
     width: 100%;
}
footer {
     height: 175px;
     background: #005959;
}

---

这应该有帮助！谢谢这有助于将页脚移到我的页面底部，但是包装器没有到达页面底部，尽管它的最小高度为100%。此外，“关于”页面上的页脚不会粘到底部。我会再处理一些，让它工作。啊…它会根据页面内容到达底部。如果需要粘贴，则需要将其固定在页面底部。您可以使用position:fixed，bottom:0，它将一直保持在那里。如果你想使用绝对定位，你需要将你的页脚拉到相对定位的部分之外。我添加了一个编辑…如果你浮动所有的内部容器，它会按你的意愿向下推。请注意，在#mainContent容器上有一个297px的底部填充，您可能可以将其删除。这基本上就是我上面的内容和我的工作基础，但它似乎仍然不起作用。您检查了JSFIDLE链接了吗