scroll-padding-left
스크롤 컨테이너의 왼쪽 패딩을 설정하여 스크롤 스냅 위치를 조정합니다. 고정 사이드바가 있는 레이아웃에서 스크롤 대상이 가려지지 않도록 보정합니다.
클래스 목록
패턴: spl{값}{단위}
| 클래스 | CSS | 설명 |
|---|---|---|
spl0 | scroll-padding-left: 0 | 스크롤 패딩 없음 |
spl8px | scroll-padding-left: 8px | 8px 패딩 |
spl16px | scroll-padding-left: 16px | 16px 패딩 |
spl2rem | scroll-padding-left: 2rem | 20px 패딩 |
spl4rem | scroll-padding-left: 4rem | 40px 패딩 |
사용 예시
<!-- 고정 사이드바가 있는 가로 스크롤 -->
<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">사이드바</aside>