scroll-padding-left

Sets the left padding of a scroll container to adjust scroll snap positions. Compensates so scroll targets are not obscured in layouts with a fixed sidebar.

Class List

Pattern: spl{value}{unit}

ClassCSSDescription
spl0scroll-padding-left: 0No scroll padding
spl8pxscroll-padding-left: 8px8px padding
spl16pxscroll-padding-left: 16px16px padding
spl2remscroll-padding-left: 2rem20px padding
spl4remscroll-padding-left: 4rem40px padding

Usage Examples

<!-- Horizontal scroll with fixed sidebar -->
<div class="spl25rem oxa df gap16px">
  <div class="fs0 w28rem bg18181B p2rem br8px">Card 1</div>
  <div class="fs0 w28rem bg18181B p2rem br8px">Card 2</div>
</div>
<aside class="pf t0 l0 w25rem h100vh bg18181B">Sidebar</aside>