What you need to know

A sticky element stays in normal flow until it reaches its offset, which differs from fixed positioning. The right approach depends on the header height, parent overflow, and how anchor links should land.

How to apply it

Use position: sticky with a clear top value, ensure the parent does not unexpectedly clip it with overflow, and add scroll-margin-top to anchored sections. Test on a short screen where the header consumes more space.

Common mistake to avoid

Do not add a sticky header without checking whether it obscures content or keyboard focus. Consider reducing its height or making it non-sticky on small screens.