自动在页脚上方添加不需要的边距 space 的元素

Question

某些东西正在向页脚添加不需要的页边距 space。我想删除它，但无法弄清楚它来自哪里。请看下图。

提前感谢您的回答。

element.style {
    margin-top: 581px;
    display: block;
}
footer#main-footer {
    background: #F60;
    padding: 60px 0 30px;
    color: #fff;
    font-size: 13px;
    line-height: 1em;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
    display: block;
}

HTML

<footer id="main-footer">

Answer 1

显然有些 javascript（可能来自框架或模板）正在动态添加 element.style（即执行脚本）。您必须至少停用您的（框架）脚本的那一部分。由于您没有提供更多信息和代码，因此只能说对您有帮助。

补充：注意图片右下角写的是什么：这就是这些东西的来源...

添加 2：您可以尝试添加 #main-footer { margin-top: 0 !important;}，但这并不是一个很好的解决方案...

Answer 2

由于问题的细节有限且无法重现该问题，我可以提出两点建议：

作为变通方法，您可以使用 footer#main-footer { margin-top: 0px !important }。虽然不推荐这样做。 https://css-tricks.com/when-using-important-is-the-right-choice/
或者，如果您希望调试问题，请开始从您的 HTML 中逐一删除 JS 引用。将有一些 JS 代码导致此问题。当您删除对该代码的引用时，您的页脚就可以了（无需使用上述解决方法）。确定 JS 文件后，您可以调试该代码以检查其添加 margin-top.

Answer 3

bootstrap mt20解决问题：<footer id="main-footer" class="mt20" style="margin-top: 581px; display: block;">

自动在页脚上方添加不需要的边距 space 的元素

An element adding unwanted margin space above the footer automatically

css

footer