scroll-padding-inline
A shorthand that sets both the start and end scroll padding in the horizontal (inline) direction on a container.
Quick example
.image-scroller {
/* Adds a 1rem safe zone on both the left and right sides of the container */
scroll-padding-inline: 1rem;
}Quick facts
Initial value
See individual propertiesInherited
No
Applies to
scroll containers
Animation type
byComputedValueType
Values
auto scroll-padding-inline 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+
15+
79+