Open Bug 1138028 Opened 6 years ago Updated 2 years ago
click on absolute element inside focusable element does not focus focusable element unless it has a CSS position
User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.115 Safari/537.36 Steps to reproduce: Create a DIV element with a tabindex. Create another DIV element inside that first DIV, with absolute positionning. http://codepen.io/jlowcs/pen/bNKaaX Actual results: When inside DIV is clicked, the focus is not set to the outside DIV. Howerver, if a position is added to the outside DIV, the focus is set when the inside DIV is clicked. Expected results: The outside DIV should get the focus whether it has a CSS position or not.
Well it kind of makes sense given that only a positioned element (position != static) is a 'containing block' for the absolutely positioned element: http://www.w3.org/TR/CSS21/visuren.html#comp-abspos (This is more visual explanation: https://css-tricks.com/absolute-positioning-inside-relative-positioning/) I don't know which spec, if any, defines the focusing behavior in this much detail. ref the SO question from which this was filed: http://stackoverflow.com/q/28772810/1026
I can reproduce on OS X 10.9 on a current Nightly. Chrome works as reporter expects.
Jerome, sorry it took so long for this to be triaged and thanks for filing this report!
Here is a real-world use-case: https://jsfiddle.net/kc865xn1/ The placeholder should disappear when the box is clicked but it doesn't because of this bug. Setting the position of the ::before element, or that of .text to relative fixes the problem. I hope this bug gets fixed. Thanks.
OS: Windows 7 → Unspecified
Hardware: x86_64 → Unspecified
Component: Event Handling → User events and focus handling
You need to log in before you can comment on or make changes to this bug.