scroll-margin-right
Forces a specific amount of empty space on the right side of an element when it's snapped into place by the browser.
It is documented as part of the CSS Scroll Snap specification.
Syntax
/* Usage Example */
.sidebar-widget {
/* Keeps the widget 20px away from the right edge when snapping */
scroll-margin-right: 20px;
scroll-snap-align: end;
}
/* Global values */
scroll-margin-right: inherit;
scroll-margin-right: initial;
scroll-margin-right: revert;
scroll-margin-right: revert-layer;
scroll-margin-right: unset;
scroll-margin-right 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.
69+
68+
14.1+
79+