IE 7 CSS下拉菜单的麻烦 [英] IE 7 CSS drop menu troubles

问题描述

我有几个下拉菜单，给我在IE7的问题。我浪费了整个上午试图解决它。客户正在使用IE7监控网站，因此它是首要任务。

I have a couple dropdown menus that are giving me issues in IE7. I've wasted the entire morning trying to fix it. The client is monitoring the site using IE7 so it's a top priority.

我有一个现场演示和 jsfiddle 演示设置。 这里是实际网站我今天正在工作，以供参考，但演示有问题隔离。

I've got a live demo and a jsfiddle demo set up. Here is the actual site I'm working on today as well just for reference, but the demos have the problems isolated. I left some of the reset css and such in case any of it is related.

有两个问题：

1. 最重要：顶级菜单中有z-index问题，IE7中的标题内容。
：在第一个链接和下拉列表之间的顶部菜单中有一个小的差距，有时会导致下拉列表中的下拉列表将鼠标从顶部链接移动到它时消失。这发生在至少Firefox 4和IE 7中。此问题不会出现在底部菜单中。

1. Most Important: There are z-index issues with the top menu and the header content in IE7. The headings are above the dropdown.
2. Less Important: There is a small gap in the top menu between the first link and the dropdown that sometimes causes the dropdown to disappear when moving the mouse to it from the top link. This occurs in at least Firefox 4 and IE 7. This issue doesn't occur in the bottom menu.

我删除了javascript，删除任何clearfix css，向下切换css和html，从html5切换到xhtml1 strict，播放位置和z-index属性，并阅读这里和其他地方的几个文章 z-index 在IE中的错误，但我仍然不能让这个预算。

I removed javascript, tried removing any clearfix css, whittled down the css and html, switched from html5 to xhtml1 strict, played with the position and z-index properties, and read several articles here and elsewhere about z-index bugs in IE but I still can't get this one to budge.

我不关心IE6支持或者如果我必须使用javascript，我只需要得到它工作在IE7为客户端。非常感谢任何帮助。

I don't care about IE6 support or if I have to use javascript, I just need to get it working in IE7 for the client. Any help is greatly appreciated.

推荐答案

到#header和#nav添加：

To #header and #nav add:

position:relative;

和

z-index:10 //for #nav
z-index:0  //for #header

这篇关于IE 7 CSS下拉菜单的麻烦的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！