Question

使用Bootstrap 3（http://www.patrickmanser.ch/fnws）在网站上工作，我希望代码是粘性页脚。我应用了Bootstrap 3示例中使用的代码，将它们调整为我的大小。它在桌面显示器上完美运行。但是，如果切换到移动大小的屏幕，则页脚会与内容重叠。我猜，这是因为页脚的大小（高度）也会改变，因为我在那里使用网格系统。您可以查看源代码（main.css），但我认为最重要的部分是：

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 237px;
    overflow-y: scroll;
    background-color: #eee;
}

#page-footer {
    position: absolute;
    bottom: 0;
    min-height: 200px;
    background-color: #333;
    width: 100%;
    color: #999;
}

.copyright {
    background-color: #222;
    min-height: 50px;
    color: #666;
    width: 100%;
    text-align: center;
    line-height: 50px;
}

我不知道如何解决这个问题，或者它是否可以正确解决。任何提示都非常感谢！

Answer 1

在您的.copyright中，它是您的＆＃34; min-height：50px;＆＃34;

如果您将其更改为＆＃34; height：50px;＆＃34;，则会减少对顶部正文内容的推动。你需要调整它，这样你就不会强迫它适应50px的行高;

或者，你也可以将你的行高减少到20px之类。当你在移动中时，这也会减少你的身体内容。

我实际上会首先尝试减少行高，看看是否修复它然后删除＆＃34; min＆＃34;看看是否有帮助。

移动粘性页脚

1 个答案: