悬停在溢出隐藏和边界半径的bug(hover on overflow-hidden and bord

试图解决一个最近的问题 ，我发现了什么样子了Chrome和IE漏洞。

当我设置2个的div，以及含div有边框半径和溢出：隐藏，内格是响应悬停在不应该的区域

在这个片段中，徘徊在灰色地带。 内部的div会改变颜色。 这发生在IE和Chrome，但不是在FF

 .innerw, .innerw2 { width: 240px; height: 240px; position: relative; border-radius: 50%; } .innerw { left: 0px; top: 0px; overflow: hidden; } .innerw2 { left: 80px; top: 0px; background-color: palegreen; } .innerw2:hover { background-color: green; } .inner2 { left: 168px; top: 13px; width: 79px; height: 229px; background-color: grey; z-index: -1; position: absolute; } 

 <div class="innerw"> <div class="innerw2"> </div> </div> <div class="inner2"></div> 

我想知道的方式来避免这种错误。

Answer 1:

我想，这与相对定位做。 如果你把上.innerw2的相对位置，并使用利润率左不是，这将不再出现。

文章来源: hover on overflow-hidden and border-radius bug