scroll-margin-right
앵커 링크로 스크롤할 때 요소 오른쪽에 여백을 추가합니다. 가로 스크롤 스냅에서 요소 간 간격을 확보하는 데 사용합니다.
클래스 목록
패턴: smr{값}{단위}
| 클래스 | CSS | 설명 |
|---|---|---|
smr0 | scroll-margin-right: 0 | 스크롤 여백 없음 |
smr8px | scroll-margin-right: 8px | 8px 여백 |
smr16px | scroll-margin-right: 16px | 16px 여백 |
smr2rem | scroll-margin-right: 2rem | 20px 여백 |
smr4rem | scroll-margin-right: 4rem | 40px 여백 |
사용 예시
<!-- 가로 스크롤 스냅에서 오른쪽 여백 -->
<div class="df oxa gap16px">
<div class="smr2rem fs0 w28rem bg18181B p2rem br8px">Card 1</div>
<div class="smr2rem fs0 w28rem bg18181B p2rem br8px">Card 2</div>
<div class="smr2rem fs0 w28rem bg18181B p2rem br8px">Card 3</div>
</div>