html - 为什么页脚不在底部

我有一个正在工作的网站。我想让页脚停留在页面底部。
因此，我遵循了一个简单的指南，该指南基本上是这样做的：

html {
    height: 100%;
}

body {
    min-height: 100%;
    position: relative;
    padding-bottom: $footer-height + $footer-margin-top;
}

.footer {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: $footer-height;
}

这似乎在一开始就起作用。然后我进入了一个阶段，即内容超出了视口高度，那就是事情停止工作的时候。

如果查看this，则可以看到页脚位于页面底部。

但是，如果您查看this，则页脚位于视口的底部。
我知道这是一个简单的解决方法，但我无法弄清楚。
有人可以帮我吗。

最佳答案

您是否希望页脚停留在页面底部，除非body上的内容足够大以至于您滚动后不会出现？

如果是这样，则应在body标记上设置height: auto;，因此，如果该值大于100%规则中设置的min-height，则它会被考虑在内并将页脚推向底部。

让我知道这是否是您的预期行为。