0

<div>嘿，关于我网站上 s的间距，我似乎有一个 CSS 问题。

如果您将浏览器指向 www.marioplanet.com，您会在我的 Apple 主题导航栏后看到一个奇怪的空格。

我想知道是否有人可以帮助我确定添加此间距的原因，以及如何消除它，因为它是不受欢迎的。

另外，我相信它与导航栏有直接关系，因为没有导航栏，这不是间距问题。

谢谢！

4

6 回答 6

1

好的，问题与您的固定宽度有关：

#globalheader{
      width: 769px;  //this is too small and actually not needed.
}

包含的列表（#globalnav）的渲染宽度为 830px（它最后有一些空白没有调查它来自哪里。所以如果你从 globalheader 中删除固定宽度并添加 200px 的左边距到#globalnav，您会将其居中并摆脱空间。

此外，如果您可以看到为什么您的列表右侧有一堆空白将其大小扩展到 830 像素，您只需执行 auto 的 margin-left 和 margin-right 并将列表居中在全局标题 div 内。

找出 ul 末尾的额外空间来自列表项的位置 gn-itunes 和 gn-support 都以 103px 的宽度呈现。这是来自 (#globalheader #globalnav LI A css 规则) 您可以覆盖 (#globalheader #globalnav li#gn-support A) 以及 (#globalheader #globalnav li#gn-itunes A) css 中的宽度规则，这也应该解决它，而无需求助于上面的修复。

于 2010-08-04T19:29:08.867 回答
1

去掉 globalheader 项中 18px 的边距部分，然后将 globalnav 项的宽度更改为 1000px：

全球导航 {

边距：0；填充：0；宽度：1000px；}

于 2010-08-04T19:27:20.007 回答
1

如果您更改 globalheader 的宽度将起作用。

#globalheader { height:37px; margin:auto; position:relative; width:515px; z-index:1; }

如果您想稍后添加更多导航链接，则必须增加 globalheader 的宽度。

于 2010-08-04T19:44:19.323 回答
1

这是因为<a></a>存在于<li id="gn-support"><a></a></li>

于 2010-08-04T19:17:08.157 回答
1

包含菜单栏的#globalheader DIV 具有 18px 的垂直边距（顶部和底部）。所以很自然，接下来的内容会被 18px 位移。

#globalheader {
height:37px;
margin:18px auto;
position:relative;
width:771px;
z-index:1;
}
于 2010-08-04T19:17:40.357 回答
1

您可能希望从 html 中删除 gn-ipad、gn-itunes 和 gn-support <li> 元素。

于 2010-08-04T19:18:04.770 回答