Css 当您触摸该div的子元素时，IE7将鼠标悬停在丢失的div上

理论上

我有一个div（container），当鼠标悬停在它的一个子div上时，它会显示（下拉）。下拉列表包含链接、图像等，当我离开它和容器时，下拉列表就会消失

<div id="container">
  <div>Hover over me to see extra stuff</div>
  <div id="drop-down">
     <div>
       <img />
     </div>
     <div>
       <a />
       <p><span>Info</span><span>More</span></p>
     </div>
     <img />
  </div>
</div> 

这是悬停的CSS

#container #drop-down {left: -9999px;}
#container .hover {left: 0;}

在实践中

在除IE7之外的所有浏览器中，它都能完美工作，但当我在第一个包含div In下拉列表中突出显示跨距时，由于某种原因，下拉列表就会出现，就好像我离开了容器一样

问题

我已经把头撞在墙上近3个小时了，试图找到所有我能找到的ie7错误，看看是否有相关的，但遗憾的是没有运气。我最初认为这可能是“z-index”问题，但由于它实际上显示在下面的内容上方，所以情况并非如此（我通过在p和跨度上设置“position:relative；z-index:9999；”进行了尝试）。除此之外，我完全被难住了。但是，我知道，该div下面的任何项目（例如，上面示例中的图像标记）在绕过p的填充上的跨距后确实会产生问题

进一步澄清： 我发现这是做的元素，躺在下面的跨度，但由于他们没有显示通过，我不知道如何修复它。此外，下面是什么元素并不重要，只要下面有一个可以“输入”的div（即，您还没有进入该div），那么您就失去了悬停，下拉列表也消失了

---

我知道我还没有发布CSS，但是有人能想到为什么会发生这种情况吗？另外，我已经禁用了所有直接在它上面工作的CSS，它仍然受到影响，但是这个问题仍然存在。

如评论中所述

在跨度上添加背景色将使悬停生效。出于某种原因，当您在IE中悬停在透明背景上时，它会认为鼠标不再位于dom对象（或者在本例中为span）中，而是位于其下方的元素中，并调用鼠标退出事件

---

微软认为这是一个bug，并且从那里链接到这个条目

已经找到了导致旧版本IE中元素消失的原因。 复制并将其添加到css中

div { display: inline-block; }

div { display: block; }

很好地解释了这个错误

div { display: inline-block; }  div { display: block; } 

---

这对我有用。。。哇，这太痛苦了。

不要使用javascript，试试看它是否有效。container.drop-down{display:none；}.container:hover.drop-down{display:block；}你能发布你的hover类吗？@Zoidberg+1提供的解决方案在绝大多数javscript中都是正确的，可以实现简单的悬停效果cases@Jonathan谢谢我没有把它作为一个答案发布，因为我不确定这是他想要的，因为这个答案在IE6中不起作用。嗯，我认为op使用的是id，所以应该是，#容器#下拉列表{显示：无；}容器：悬停#下拉列表{显示：块；}，但效果很好。OMG。我不敢相信IE中还有我不知道的bug。谢谢。宇宙中只有两个无限的东西，一个是IE中的bug数量。

div { display: inline-block; }  div { display: block; }