HTML和CSS导航菜单危机

我有一个由嵌套列表组成的垂直导航菜单，但是当子菜单处于活动状态时，该菜单下的任何内容都不可点击。HTML和CSS导航菜单危机

例如在下面的链接“测试作物”是活跃的，但我不能点击下面的这两个链接，我看不到在我的HTML或CSS的问题，我认为该错误只在Firefox中显而易见，在这里是链接http://apigroup.factoryagency.co.uk/browse-products/laminate-board-paper/Test-Crop

来源

2012-02-16 Udders

你可以把你的CSS和HTML更好的可读性的小提琴吗？ http://jsfiddle.com – 2012-02-16 06:53:41

这是因为你有这样的CSS：

.wrapper { 
    clear: both; 
    margin: 0 auto; 
    position: relative; 
    width: 944px; 
    z-index: 1000; 
}

还有的两个div类别包装，具有相同的z-索引。第一个包含导航。第二个包含大量的内容。第二个，因为它发生在页面后面，并且具有相同的z-索引，将出现在第一个之上。这意味着它覆盖了导航，防止被点击。

解决的办法是给第一个div.wrapper一个较高的z-index。你可以通过给它一个ID来做到这一点，然后在该ID上设置z-index。

来源

2012-02-16 06:55:52 Interrobang

你的问题是因为导航菜单是一个.wrapper类的子节点以及主内容区域，它们的Z索引都是999.页面下方的.wrapper元素在这种情况下将采用z-index优先级。正如您在我的屏幕截图中所看到的那样，主要内容区域的优势和测试公司标题与导航元素重叠。我想补充一个附加的类的主要内容区域和指定的z-index小于999

screenshot

来源

2012-02-16 06:55:38 Anthony

HTML和CSS导航菜单危机

回答

相关问题