Bug 238127 - Sticky positioned element inside grid has incorrect z order
Summary: Sticky positioned element inside grid has incorrect z order
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: Safari 15
Hardware: All macOS 10.15
: P2 Critical
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2022-03-20 09:09 PDT by Andrey Moiseev
Modified: 2023-12-17 04:12 PST (History)
2 users (show)

See Also:


Attachments
minimal html (1.30 KB, text/html)
2022-03-20 09:09 PDT, Andrey Moiseev
no flags Details
video (12.93 MB, video/quicktime)
2022-03-20 09:11 PDT, Andrey Moiseev
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Andrey Moiseev 2022-03-20 09:09:44 PDT
Created attachment 455198 [details]
minimal html

Sticky positioned element inside grid rendered above its siblings on scroll, in-spite of being the first child in DOM, and placed in a first row of the grid container.
Works as expected in google chrome.

Notes:
- height of grid elements are auto;
- if you set top:10px for the sticky positioned element it will rendered underneath the second child, but still above others when you scroll

Safari 15.3
iOS 15
Comment 1 Andrey Moiseev 2022-03-20 09:11:29 PDT
Created attachment 455199 [details]
video

Video
Comment 2 Radar WebKit Bug Importer 2022-03-21 22:20:41 PDT
<rdar://problem/90613929>
Comment 3 Andrey Moiseev 2023-12-17 04:12:22 PST
Hi guys, is there any update regarding this bug?
I rise it to critical.
I work at Wix.com, all layout of Wix sites is based on css grid, and this bug prevent us to use sticky position layout on Safari browsers, which creates very significant feature parity between Chrome and Safari browsers.
Is it possible to fix this bug please?