[Webkit-unassigned] [Bug 160953] WebKit incorrectly clips position:fixed element, inside of its "position:relative; overflow: hidden" parent, IF that parent has "z-index" set

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=160953

kokovtsev at gmail.com changed:

           What    |Removed                     |Added
----------------------------------------------------------------------------
                 CC|                            |kokovtsev at gmail.com

--- Comment #23 from kokovtsev at gmail.com ---
The original testcase is not reproducible (i.e. works as EXPECTED) in Safari 17.5, however a slight modification where an intermediate statically position child is added between the relpos and the teal div:

.posrel > .static > .fixed

https://jsfiddle.net/z81ahequ/10/

After playing around a bit, it turns out that the bug is reproducible when the parent div has overflowing content, that is when the parent is actually scrollable. In the sandbox above, applying smaller width and height to .static "fixes" the bug. Changing `overflow: auto` to `overflow: hidden` also "fixes" the problem.

According to the Inspector, the .relpos becomes a separate layer because "Element has "-webkit-overflow-scrolling: touch" style", which apparently is added implicitly when the element can be scrolled.

More observations:

.relpos { z-index: 0; } + overflowing content => teal div clipped (BUG)
.relpos { /* no z-index */ } + overflowing content => teal div overflows (CORRECT)
.relpos { will-change: transform; /*and no z-index*/ } => teal div clipped even if there is no scroll in .relpos, however this seems CORRECT according to the spec as the .relpos becomes a containing block for the fixed element

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20240726/216c876d/attachment.htm>