[CSS] a 태그 padding, margin 제거하기 (React router dom의 Link 태그에도 해당)

a 태그를 다른 태그의 내부에 집어넣으면 위 아래에 미묘하게 padding이 생긴다. 또 a 태그를 inline 혹은 inline-block으로 만들었을 때 좌우로 margin이 생겨서, 좌우로 딱 붙이고 싶어도 붙지않는 경우가 생긴다.

 

이럴 때는 a 태그를 감싼 부모 태그에 font-size: 0을 준다.

React에서 react-router-dom의 <Link /> 태그를 사용하고 있다면 Link 태그의 부모에도 마찬가지로 font-size: 0을 주면 된다.