# Combine sticky headers with full-height sections

Canonical source : [Combine sticky headers with full-height sections](<https://sebastien.rigaux.be/en/tech-watch/links/combine-sticky-headers-with-full-height-sections>)

The article examines position: sticky pitfalls when a header must coexist with viewport-height elements. It explains container constraints that can make these layouts fragile.

- Selected on : 2024-09-13

- Entry updated : 2026-10-14T07:00:28+0000

- Format : Article

- Source language : EN

- Credit : https://www.smashingmagazine.com/author/philip-braunen/

Original resource : [Combine sticky headers with full-height sections](<https://www.smashingmagazine.com/2024/09/sticky-headers-full-height-elements-tricky-combination/>)

Tags : [CSS](<https://sebastien.rigaux.be/en/tech-watch/tags/css>) · [UI/UX](<https://sebastien.rigaux.be/en/tech-watch/tags/ui-ux>)

Available versions : [Français](<https://sebastien.rigaux.be/veille/liens/faire-cohabiter-un-header-sticky-et-une-section-plein-ecran>) · [English](<https://sebastien.rigaux.be/en/tech-watch/links/combine-sticky-headers-with-full-height-sections>)

[Back to tech watch](<https://sebastien.rigaux.be/en/tech-watch>)