css

1. tab을 line-height : 30px로 높이를 통일 시킨 값은 border 1px인 span들에 영향을 받는다
   => [ 해결책 ] align-items: center로 바꾸면 클릭했을 때 움직이지 않음 (알아서 center시켜줌)

2. ::after, ::before

overflow auto 하고 있는 부모 요소에 margin,padding-right가 안 먹혀서 (사파리에서)가상 요소로 해결하려고 함.
가상 요소라서 실제 너비가 있지 않다.
특히 부모 요소가 overflow:auto에 width가 정해져있지 않다면 더 너비와 같은 레이아웃에 영향을 줄 수 없다

이상하게 margin, padding은 된다
그러므로 가상요소에 margin-right 또는 padding-right로 주고 싶은 만큼 값을 준다