我知道这已经在这里讨论过很多次，但我在这里找到的答案似乎都没有解决我的问题。
我有这个可变(高度)布局，并希望页脚始终贴在底部。
我使用了 min-height: 100%;到容器 div，并以某种方式让它始终位于底部。问题是，它沉得太低了。
我在这里举了一个例子:
如您所见，我的页脚位于底部，但会在底部太远，即使页面上有空间来显示它，它也会创建一个滚动条。
此外，我希望主容器显示得与内容一样大(即闭合正方形)，但现在，看起来容器一直延伸到底部，而我的页脚正在覆盖它。
我做错了什么？
提前致谢
最佳答案
您应该再次查看 Ben Lee 的链接 :)。我已经在你的布局中使用它来达到你想要的效果。在这里查看:http://jsbin.com/erono3/2
重要的是让页脚成为容器的一部分。容器的最小高度为 100%。所以它总是占据整个屏幕。标题是正常的，无论它在里面是什么。
那么您应该有一个内部容器元素(重要)，您的主要内容位于其中。在上面的链接中，它的 ID 为 #body。这将有一个填充底部(为页脚留出空间。
页脚用 bottom:0px 绝对定位意味着它总是在容器的底部(容器必须是 position:relative) .
编辑(回应评论)
要使您的页脚横跨整个页面，但保持其他所有内容居中，只需执行以下操作:
去掉#container的宽度，#container横跨整个页面。为上面链接中的 #body 元素提供一个宽度，并使用 margin: 0px auto 将其居中。您会得到想要的效果。
关于html - 帮助页脚始终位于底部，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4178684/