Bug 230390 - Elements with position: sticky inside grid have spaces
Summary: Elements with position: sticky inside grid have spaces
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: Safari 14
Hardware: iPhone / iPad Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2021-09-17 00:09 PDT by kovalev.mine
Modified: 2021-10-04 01:22 PDT (History)
6 users (show)

See Also:

Attachments
Test case for this issue (1.53 KB, text/html)
2021-09-20 00:56 PDT, Martin Robinson 		no flags Details
View All Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description kovalev.mine 2021-09-17 00:09:07 PDT 
Here you can see the problem
https://jsfiddle.net/1c7La89w/22/

On some scales (sometimes it happens in 100% scale too) elements with position: sticky create spaces.
It occurs without display: grid, but we fixed this problem locally using crutch.
We put margin-top: -1px, paddin-top: 1px and top: (needed top - 1px). It works fine for simple blocks.
But with display: grid we have horizontal and vertical spaces, witch can't be fixed with our crutch as you can see in jsfiddle
Comment 1 Martin Robinson 2021-09-20 00:56:10 PDT 
Created attachment 438644 [details]
Test case for this issue
Comment 2 Radar WebKit Bug Importer 2021-09-24 00:10:18 PDT 
<rdar://problem/83483124>
Comment 3 Martin Robinson 2021-10-04 01:22:34 PDT 
I am seeing some cracks (I assume they are between layers) in Chrome, but not in Safari. Can you confirm that you are seeing this issue in Safari?