scroll-padding-top
Sets a fixed amount of padding on the top of a scroll container that specifically interacts with scroll snapping. Often applied to the root element to account for sticky headers.
Quick example
html {
/* Global safe zone for all scroll-to-element actions (like anchor links) */
scroll-padding-top: 80px;
}Quick facts
Initial value
autoInherited
No
Applies to
scroll containers
Animation type
byComputedValueType
Values
auto scroll-padding-top Browser Support
Widely available Since 2020 95% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2020.
Safe to use without fallbacks.
69+
68+
14.1+
79+