scroll-margin-left
앵커 링크로 스크롤할 때 요소 왼쪽에 여백을 추가합니다. 가로 스크롤 스냅에서 요소가 컨테이너 왼쪽 가장자리에 붙지 않도록 간격을 확보합니다.
클래스 목록
패턴: sml{값}{단위}
| 클래스 | CSS | 설명 |
|---|---|---|
sml0 | scroll-margin-left: 0 | 스크롤 여백 없음 |
sml8px | scroll-margin-left: 8px | 8px 여백 |
sml16px | scroll-margin-left: 16px | 16px 여백 |
sml2rem | scroll-margin-left: 2rem | 20px 여백 |
sml4rem | scroll-margin-left: 4rem | 40px 여백 |
사용 예시
<!-- 가로 스크롤 스냅에서 왼쪽 여백 -->
<div class="df oxa gap16px">
<div class="sml2rem fs0 w28rem bg18181B p2rem br8px">Card 1</div>
<div class="sml2rem fs0 w28rem bg18181B p2rem br8px">Card 2</div>
<div class="sml2rem fs0 w28rem bg18181B p2rem br8px">Card 3</div>
</div>