SCSS 단추 사이사이에만 여백을 주고싶습니다!

Question

안녕하세요!아래의 사진과 같이 동그라미가 있습니다. border-radius로 50%로 동그라미를 만들어줬습니다.근데 동그라미 사이사이에만 여백을 주고 싶습니다. (바깥쪽이 아닌 사이사이에만요!)margin-inline-end ~ start 까지 다줘봤는데 무조건 양쪽 끝 방향중 하나는 단방향으로 여백이 들어가네요ㅠ소스 공통화를 시켜서 하나의 소스로만 사이사이에 여백을 주고싶은데 어떤 코드를 넣어주는게 좋을까요?!

LostStarz · Accepted Answer

마지막 만 제외하고 margin-right를 주면 되지 않을 까요

.out {display:flex;}.in {width:100px;height:100px;border:1px solid black;}.in:not(:last-child) {margin-right:10px;}/// flex에 gap을 줘도 되는군여.out { display:flex; gap:10px;}.in{ width:100px; height:100px; border:1px solid black;}

EmDev · Answer

동그라미 부분에 걸린 클래스 이름이 a라고 치면.a &#43; .a { margin-left: 주시고 싶은 마진 }이렇게 설정해주시면 됩니다

SCSS 단추 사이사이에만 여백을 주고싶습니다!

2개의 답변

#scss 목록