CSS Sticky Position

CSS Sticky Position — a practical guide to CSS position sticky with clear examples you can reuse in real projects.

CSS Tutorial Series (39/109). Prefer one article? Read the complete CSS tutorial.

Short description

Needs a scroll container and threshold (`top`) to activate.

Sticky

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
}