如果页面上有嵌入/ iframe代码，则在Chrome中悬停无法正常工作

Question

我知道这有点奇怪，但如果我的网页上有嵌入/ iframe代码，则Chrome浏览器无法正常工作。

问题在于，当我将鼠标放在顶部的两个盒子（li）上时，它们会有一个幽灵悬停（意思是，即使我的鼠标不再悬停，也有悬停效果）。只有在页面上有iframe时才会发生这种情况。我尝试删除iframe（对于YouTube嵌入代码），问题就消失了。

有连接吗？这是我的悬停代码：

CSS：

.boxes > li {
   background: none repeat scroll 0 0 transparent;
   border-image: none;
   border-style: none none dashed;
   border-width: medium medium 1px;
   box-shadow: none;
   display: block;
}

.boxes > li:hover {
   background-color: #E0EDFF;
   border-color: #E0EDFF;
   box-shadow: 2px 2px 4px #BBB;
}

HTML：

<ul class="boxes">
  <li>
    <div class="detail">
        <h4>Some Title</h4>
        <div><p>Some paragraph. <a href="#">Read More »</a></p></div>
    </div>
  </li>
</ul>