[Webkit-unassigned] [Bug 148898] New: Padding of an element BEHIND ignores z-index, blocking clicks for elements IN FRONT.
bugzilla-daemon at webkit.org
bugzilla-daemon at webkit.org
Sat Sep 5 04:08:56 PDT 2015
https://bugs.webkit.org/show_bug.cgi?id=148898
Bug ID: 148898
Summary: Padding of an element BEHIND ignores z-index, blocking
clicks for elements IN FRONT.
Classification: Unclassified
Product: WebKit
Version: Other
Hardware: iOS
OS: iOS 7.1
Status: NEW
Severity: Major
Priority: P2
Component: Layout and Rendering
Assignee: webkit-unassigned at lists.webkit.org
Reporter: cuentanumerouno at hotmail.com
Seems like the PADDING of an element BEHIND ignores z-index, blocking the clicks for elements IN FRONT.
Elements can't be clicked (links, text, nothing) when falling over the padding of the element behind.
The un-clickable elements are IN FRONT, as per z-index value, so the padding that is blocking them up is BELOW. The padding in the blocking element comes LATER in the code than the blocked elements, but still behaves as if the padding was an actual element in front, preventing the elements before (above as per z-index) from being clickable.
As a result, ALL the navigation items in miamifishing.com are UNCLICKABLE.
How to reproduce it:
Tested on iPhone5 Safari, iOS 7
Go to miamifishing.com (home page only) and touch âcharter infoâ menu item (at the very right, because the rest is also unclickable). You should get a sub-menu (drop down with css) from which you CANâT click anything except the last item, which happens to fall over div#page. If you REDUCE the top padding of #page, you can click them all!
Itâs like the PADDING of an element BELOW falls ON TOP of elements ABOVE, blocking the clicks.
I removed all the click events for the page with a small script before body (or as below as I could, since google oauth added its script below) and paused all scripts, and the issue persists.
I still don't understand how the rest of elements in header_wrapper are also unclickable, but it seems a similar issue, e.g. "they don't fall over any static element" as it seems to need the case above.
Further test: instead of reducing the top-padding of #page, add a negative top-margin, let's say -400px, to its child or grand-child, and even the invisible content over the padding will make the items inside the drop-down sub-menu clickable.
Sorry I'm not as good programmer to track the hundreds of properties of each element, in the developer tools, but it seems it's no event or property, but just element's surface blocking others.
--
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://lists.webkit.org/pipermail/webkit-unassigned/attachments/20150905/515d057f/attachment-0001.html>
More information about the webkit-unassigned
mailing list