CSS：标题覆盖导航菜单，打破悬停效果

我目前正在研究这个网站，并刚刚注意到div＃的问题，它覆盖了菜单，因此只能在文本下方悬停链接。有没有人有任何想法如何解决这个问题？ http://gridironstuds.com/CSS：标题覆盖导航菜单，打破悬停效果

2011-05-15 Josh Bedo

我在Google的开发工具中看不到'a：hover'定义 – Pwnna 2011-05-15 02:32:18

只是关于您链接页面的一个提示：我个人非常不喜欢嵌入YouTube视频并开始自动播放的页面。也许让我们按自己的戏？ :) – Nathan 2011-05-15 02:40:39

@ultimatebuster这不是问题。 div＃top覆盖了导航栏的一部分。我建议尝试使用徽标图像上的CSS属性float，以便div＃top不那么大。 – 2011-05-15 02:41:15

我使用Chrome检查，只是改变了这种

div#top {position:absolute;}

到

div#top {position:static;}

，并固定权利了。问题是，为什么你的头衔在体内？它应该在你的html的头部。

2011-05-15 06:10:07 robx

哇，永远不会知道这将工作，我认为静态会让它保持在顶部，当你滚动。感谢迄今为止我的工作尚未在所有浏览器中进行测试 – 2011-05-15 17:59:08

您已经确定了问题：div#top覆盖了菜单。要解决这个问题，请缩短元素：将它的height属性更改为更小的值（看起来像88px是完美的）。

请尝试与<div id="top" class="centerContainer" style="height:88px;">的页面。
如果看起来不错，请将其添加到您的master.css中的div#top规则中。

2011-05-15 02:37:41 Nathan

唯一的问题是它削减的标志图像，我需要它重叠菜单。 – 2011-05-15 03:14:49

@josh然后你必须浮动图像并使用边距来定位它，或者使用一些div和z-index。 – Nathan 2011-05-15 04:00:57

指定div的高度＃top {height：100px;}并缩小logo图片的大小。

2011-05-15 03:57:56 Anish

-2

您可以尝试使用z-index将菜单置于标题图像上方。然后，菜单的背景可能是透明的，以便它在之后仍然可见。

2011-05-15 04:13:21 tlunter

但问题是，当你悬停在菜单上，它不显示链接。标题Div是重叠的。如果你把z-index，问题保持不变。 – Anish 2011-05-15 04:25:49

我现在注意到了。我正在计算Z-index能够将菜单div放在图像上方，但它似乎不像锚点那样工作。指定高度为100px的作品。 – tlunter 2011-05-15 04:27:55

回答