:hover works only on lower part of rotateX transformed div

问题

I have div with CSS rotateX transform applied to it:

-webkit-transform: perspective(500px)  rotateX(60deg) rotateY(60deg) ;

and a bunch of smaller div's floated in it, with :hover rule applied to them. The problem is that only half of inner divs react to :hover event.

JsFiddle: http://jsfiddle.net/fNxgn/4/

回答1:

if you remove in css height: 200px all block will react hover event

来源：https://stackoverflow.com/questions/10534697/hover-works-only-on-lower-part-of-rotatex-transformed-div