4

网站底部的页脚后似乎有随机空白，但它只显示在 IE 和 Firefox 中。该网站在 Safari 和 Chrome 中运行良好。当我尝试使用检查元素时，空白似乎不属于任何标签。它似乎与任何页脚标签无关，因为删除它们并没有改变任何东西。网站链接为： http: //www.insightdatascience.com。

我查看了很多答案，但似乎没有一个专门适用于我的网站。谢谢！

4

3 回答 3

3

我有类似的问题。对此类问题的更一般修复是添加：

body {
    overflow: hidden;
}

到您的 css 文件。

于 2014-12-13T15:02:53.830 回答
2

在stylesheetmain.css中，您有以下规则：

.fellows #insightpictures .buttons {
    margin: 635px auto;
}

更改margin: 635px auto;为margin: 635px auto 0;以删除下边距。

于 2013-01-25T02:57:54.360 回答
0

我也有类似的问题，仅在 FireFox 上。

我有一个典型的页面布局，上面有顶部窗格和底部窗格等。我用 Grid 设置了它的布局。通过将底部窗格的背景设置为粉红色，我可以看到它覆盖了在页面底部边缘结束的预期区域。但是出现的垂直滚动条允许我在底部窗格下方滚动，从而显示它下面有空白区域。

我的问题是（由事实引起）在底部窗格中我只有一个未设置样式的 H3。默认情况下，FireFox 为 H3 元素提供了顶部和底部边距，这导致内容流过底部窗格的底部边缘。

当我将 H3 元素的边距设置为 0px 时，问题就消失了。

所以我想一般要意识到的是，即使你的容器元素（比如我的底部窗格）在页面末尾整齐地结束，如果它有太多的内容，它可能会溢出并在它下面创建额外的空间。一个通用的解决方案是在这样的元素上设置溢出：隐藏。内容不会自动停留在其容器的边界内。您必须明确防止溢出，如果有一些并且您不想要它。

为什么我在 FireFox 上看到了这个问题，而在 Chrome 上却没有？原来 H3 的默认样式在 Chrome 上是不同的，它给了它更少的下边距，所以没有足够的它来导致溢出。

于 2021-07-13T18:30:51.017 回答