CSS悬停和滚动错误CHROME-如果滚动条悬停，则父元素消失[重复]答案

【问题标题】：CSS hover & scroll bug CHROME - the parent element disappear if scrollbar hovered [duplicate]CSS悬停和滚动错误CHROME-如果滚动条悬停，则父元素消失[重复]
【发布时间】：2017-07-06 03:31:50
【问题描述】：

我在 chrome 中有 strange bug，而我在 firefox 中对其进行了测试，并且运行良好。

问题在于将display: block 元素包含在其中的悬停元素，当有溢出滚动时，如果将鼠标悬停在滚动上，隐藏的元素就会消失。在Firefox中没问题。

Chrome version: 56.0.2924.87

bug重现如下，悬停在滚动条上自行重现：

.on_hover {
  border: 1px solid red;
  position: relative;
}
.hidden_block {
   display: none;
   width: 200px;
   height: 200px;
   position: absolute;
   top: 15px;
   left: 0px;
   border: 1px solid #ccc;
}
.hidden_block .overflow_block {
   position: relative;
   width: 100%;
   height: 160px;
   max-height: 160px;
   overflow-y: auto;
   overflow-x: hidden;
   border: 1px solid blue;
}

/* On hover display hidden block: */
.on_hover:hover .hidden_block {
  display: block;
}

<div class="on_hover">
  Hover me
  <div class="hidden_block">
      <div class="overflow_block">
          <p>Test the content overflow</p>
          <p>Test the content overflow</p>
          <p>Test the content overflow</p>
          <p>Test the content overflow</p>
          <p>Test the content overflow</p>
          <p>Test the content overflow</p>
          <p>Test the content overflow</p>
          <p>Test the content overflow</p>
          <p>Test the content overflow</p>
          <p>Test the content overflow</p>
          <p>Test the content overflow</p>
      </div>
  </div>
</div>

有人有解决办法吗？

谢谢大家

【问题讨论】：

太棒了！
这对我来说似乎很好。在 chrome 和 firefox 中的行为相同。
@MichaelCoker 不适合我 Chrome 56.0.2924.87 - Windows10 - 你的是什么？
我报告了这个错误。
在 Chromium 59 中似乎没有问题

标签： css google-chrome hover

【解决方案1】：

它在 Chrome 55.0.2883.75、Windows 10 上运行良好。更新到 56.0.2924.87 后，它无法正常工作。我猜这是 Chrome 56 版本的 bug，有必要向谷歌报告！

【讨论】：