Bug 247130 - Elements with `position: sticky` jitter inside a container with `overflow-x: clip;`
Summary: Elements with `position: sticky` jitter inside a container with `overflow-x: ...
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Scrolling (show other bugs)
Version: Safari 16
Hardware: All Unspecified
: P2 Normal
Assignee: Simon Fraser (smfr)
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2022-10-27 09:18 PDT by Matias
Modified: 2022-11-13 08:50 PST (History)
4 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Matias 2022-10-27 09:18:59 PDT
When you put an element with `position: sticky` inside a container that has `overflow-x: clip;` the position of the sticky element behaves erratically when scrolling. It jumps up and down by 1-2px.

Reproduction: https://codepen.io/enyo/pen/xxzboep
Comment 1 Radar WebKit Bug Importer 2022-10-27 12:20:46 PDT
<rdar://problem/101645570>
Comment 2 Simon Fraser (smfr) 2022-11-11 10:11:27 PST
We've got a clipping layer with infinite height:

                        (GraphicsLayer 0x6631351f0 "ancestor clipping"
                          (position 109.00 -16777216.00)
                          (bounds 600.00 33554430.00)
Comment 3 Simon Fraser (smfr) 2022-11-11 17:25:26 PST
Pull request: https://github.com/WebKit/WebKit/pull/6417
Comment 4 EWS 2022-11-13 08:50:53 PST
Committed 256618@main (854716970c07): <https://commits.webkit.org/256618@main>

Reviewed commits have been landed. Closing PR #6417 and removing active labels.