[Webkit-unassigned] [Bug 69742] Hover not triggered on the right half of elements that have both rotateY and rotate applied.

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Fri Jun 7 15:34:35 PDT 2013


Gabriel Luethje <gabriel at thefstopdesign.com> changed:

           What    |Removed                     |Added
                 CC|                            |gabriel at thefstopdesign.com

--- Comment #4 from Gabriel Luethje <gabriel at thefstopdesign.com>  2013-06-07 15:33:10 PST ---
I am not sure if this is related or a separate bug. It is similar:

I have found that if I set an item to display: inline-block, and rotate(Xdeg);, the hover area for that item reduces to half the width of the item on rotateY(), and half the height of the item on rotateX(). 

display: block; items do not seem to be affected, and it only seems to happen in Webkit browsers.

In both cases, the half of the element that appears "farthest" does not respond to hover. As suggested by Chris Coyier in the thread I posted on csstricks.com: http://css-tricks.com/forums/discussion/comment/106207/#Comment_106207 it seems like the browser interprets half of the image to be below or behind the plane of the page.

I did notice that if I add a translateZ() of at least 15px in the example below it does solve the issue.

I created a simple pen to illustrate: http://codepen.io/FStop/pen/smzfr

Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.

More information about the webkit-unassigned mailing list