Is that it broke on the afternoon of April 13 and that bug 234851 is responsible. Nigtlies and find when this broke on the branch, that would help a ton. Which doesn't leave many options, does it? If someone can grab some branch I have a container div, A, with overflow: hidden, and inside, I have a div, B, with a fixed position. Since this is also showing up in 1.7rc1, apparently, we have to intersect that This regressed on trunk the day 1.8a opened for checkins. So, according that spec text, the parent element’s overflow shouldn’t have any effect because the fixpos’ parent element is the viewport. The only difference is that for a fixed positioned box, the containing block is established by the viewport. So we don't waste time looking at the wrong code. Fixed positioning is similar to absolute positioning.
Jeroen, you're reporting this against 1.7rc1, right? If not, please say so ASAP The document loads, but a scrollbar is shown in the first div.Ī scrollbar should not be shown because of the style overflow: hidden Create a document with the following contents: Is higher then the parent div, a scrollbar is shown, previous versions (1.7betaĪnd below) didn't show a scrollbar which is what I expected.ġ. When I create a div with style= position:fixed overflow:hidden and in thisįixed div I place another div with position:absolute and the height of this div
See from I’ll try to write a follow-up post when I understand everything.User-Agent: Mozilla/5.0 (Macintosh U PPC Mac OS X Mach-O en-US rv:1.6) Gecko/20040206 Firefox/0.8īuild Identifier: Mozilla/5.0 (Macintosh U PPC Mac OS X Mach-O en-US rv:1.7b) Gecko/20040421 If you happen to know why, send a self-addressed stamped envelope to twitter dot com slash miketaylr and let me know. Unfortunately at least one site relies on this bug (see this comment). So it seems like non-Edge and non-Firefox browsers treat a position: fixed element as a position: absolute element (or something?), when contained by a position: relative parent that also has a z-index set. Adding a fixed height can solve the issue, but that’s not always desirable. It’s like that element is ready to stick when the parent scrolls, but it never does because the height is unconstrained. The only browser this seems to make a difference in is Chrome on Android, which now clips the child element. Any overflow value other than visible and no height is the enemy of child elements with position: sticky. Mobile + Desktop Opera (Blink): same as ChromeĪnd now, a 3rd testcase which adds user-scalable=no to the meta (viewport) element (the same effect happens if you constrain intial-scale and maximum-scale to 1. If the used box is direct child for body and has neighbours, then it makes sense to check z-index and top, left properties, since they could overlap each other, which might affect your mouse hover. Mobile + Desktop Opera (Presto): same as Safariĭesktop Chrome: if the viewport is smaller than the containing parent, then overflow: hidden on the parent kicks in (resize the browser window to see it). Generally speaking, fixed section should be set with width, height and top, bottom properties, otherwise it won't recognise its size and position. Mobile + Desktop Safari: fixpos element is clipped by parent (meaning overflow: hidden worked). Same as first testcase (what I would expect):
Now if you throw in both a z-index: 1 (any number will do) and a position: relative on the parent element, things get…different. overflow: hidden on the parent is ignored. But how do browsers behave? Open this testcase and have a look:Įverything behaves as the spec describes. If you have an element with position: fixed inside of an element that has overflow: hidden, what’s the expected rendering when you need to, uh, overflow? Should the inner fixpos element be clipped by its parent or not?įixed positioning is similar to absolute positioning.