css - 带有表单的弹出框 - 悬停在建议上（IE 错误）

Question

我有一个大问题。在顶部我有一个按钮，如果你将鼠标悬停在它上面，你会得到弹出框。现在您单击输入并获取建议。

当您将鼠标悬停在 IE 9 中的一个建议上时，弹出框会失去焦点/悬停，我必须再次将鼠标悬停在按钮上才能获得弹出框。

有什么想法或解决方案吗？

<div class="has-layer">
  <a href="">Fachpartner-Portal</a>
  <div class="popover"></div>
</div>

---

.has-layer .popover {
  display: none;
}
.has-layer a:hover + .popover {
  display: block;
}

它适用于所有现代浏览器。只有 IE 问题。

Answer 1

当我读到'它适用于所有现代浏览器。只有 IE 问题'我自己认为：这种设计有问题，在 Internet Explorer 上不会重新编写它。

如果该元素不在锚点内，您如何期望您的元素在锚点上触发：悬停？

一旦指针离开锚点（移动到另一个容器），css 就会正确运行。

尝试另一种设计：

<div class="has-layer">
    <a href="">Fachpartner-Portal
        <div class="popover"></div>
    </a>
</div>