| Summary: | Sticky positioned element inside grid has incorrect z order | ||||||||
|---|---|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Andrey Moiseev <moiseev.andy> | ||||||
| Component: | CSS | Assignee: | Nobody <webkit-unassigned> | ||||||
| Status: | NEW --- | ||||||||
| Severity: | Critical | CC: | simon.fraser, webkit-bug-importer | ||||||
| Priority: | P2 | Keywords: | InRadar | ||||||
| Version: | Safari 15 | ||||||||
| Hardware: | All | ||||||||
| OS: | macOS 10.15 | ||||||||
| Attachments: |
|
||||||||
Created attachment 455199 [details]
video
Video
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? |
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