CSS

The Real Fix for Sticky Headers That Jump on Scroll

- - ErcanOPAK

The issue is usually layout reflow, not position: sticky.

header {
  position: sticky;
  top: 0;
  will-change: transform;
}

Why this works
will-change hints the browser to optimize rendering early.

Related posts:

Create Smooth Page Transitions with CSS View Transitions API (No JavaScript)

CSS vh Breaks Mobile Layouts

100vh Breaks Mobile Layouts — Here’s Why

Post Views: 7

Leave a Reply

Your email address will not be published. Required fields are marked *