css - 堆栈溢出式页脚？

Question

Stack Overflow 上的这个页脚是一个梦想：全长页脚的颜色与正文不同，但文本与中心列对齐，并且粘在页面底部。

我想我得到了粘性部分，但无法概念化与全长页脚对齐是如何做到的。

我想知道是否有人成功地构建了像 Stack Overflow 中的页脚，以及他们是否可以帮助我理解编码。

Answer 1

这是因为 stackoverflow 与许多网站一样，使用广泛接受的 960 像素页面容器宽度标准。

在您的全宽页脚容器中，放置第二个不可见的内容容器，其宽度与主文档正文的宽度相同，例如 960 像素。这是stackoverflow的body容器：

#content {
    margin: 0 auto;
    width: 960px;
    min-height: 450px;
}

这是页脚内容的容器：

.footerwrap {
    margin: 0 auto;
    text-align: left;
    width: 960px;
}

此外，我不认为页脚“粘”在任何东西上。它只是在文档的末尾，所以它呈现在页面的底部。我可能错了，因为我没有详细查看 stackoverflow 的 html 源代码，但其他任何东西似乎都过大了。