javascript - 为什么我在所有 HTML 内容下方都有一个大的空白？

Question

出于某种原因，在此页面上使用了一个巨型下拉菜单，在所有内容下方有一个巨大的空白区域，您可以滚动过去页脚。你能帮我弄清楚发生了什么吗？

我很确定它与巨型下拉菜单有关，因为当你将鼠标悬停在它上面时，空白就会消失。（菜单项“合作社和职业”是巨型）

奇怪的是，这两个页面也使用它并且没有问题（其他一些样式在这两个上搞砸了，但这并不影响它，因为我让它们与损坏的页面具有相同的主题/样式并且它们仍然没有——他们目前的风格已经坏了，所以另一个开发者可以研究别的东西）

谢谢。

编辑：当您检查元素时，与检查器工具栏的大小相比，空白区域会按比例变大 - 如果有帮助的话。

score 0 · Accepted Answer

这可能是因为相对定位。例如，在底部自然结构化的 div 块被强制放置在顶部。在这种情况下，将始终保留 div 块的空间，从而留下空白！！！

score 0 · Accepted Answer

这是因为在custom.css你有：

#wrapper {
    min-height: 100%;
    position: relative;
}

删除min-height: 100%，效果很好。

PS我将页脚更改为没有绝对定位，因为它使水平条出现在浏览器窗口下方，如下所示：

#footer {
    bottom: 0;
    height: 60px;
    width: auto;
    margin-top: 10px;
    margin-bottom: 0;
    padding: 1%;
    text-align: center;
}

score 0 · Accepted Answer

0

尝试设置#menu-item-197 {overflow:hidden}

或者干脆#pagenav li {overflow:hidden}

于 2012-07-24T19:31:55.473 回答

3 回答 3