Label 태그와 SelectionBox의 display 설정이 inline-block인 이유

Label Tag의 경우,

• marign top과 margin bottom에 값을 적용하는 디테일한 조정이 어려움

SelectionBox의 경우,

• Label과 같은 이유일 뿐만 아니라, Wrapper를 inline으로 하게되면,
• option 글자 크기를 3rem으로 했을 때, 그에 맞게 Wrapper의 사이즈가 변하지 않음.
디자인이 깔끔해지지 않으며, 이는 Expand Arrow Icon의 위치를 정하기 매우 어려운 요인으로 작용함.
뿐만 아니라, option 글자와 SelectionBox의 밑줄간 간격 조절이 불가능함.

• Wrapper를 Block으로 하게되면, 100%를 다 차지함
• width를 조절하면 되지 않느냐? 불가능. SelectionBox의 글자 크기에 따라서 자동으로 늘어나고 줄어들게 해야함. 즉 inline 속성이 필요함

• 위 내용을 종합해 봤을 때, inline으로 가도 문제가 발생하고, block으로 가도 문제가 발생함을 알 수 있음. 즉, 양쪽의 장점을 다 취하기 위해서는 inline-block이 필요함.

Library를 사용하지 않는 이유

• 부담이 큼. 사용법이 한눈에 안들어옴. 추후에 점진적으로 리펙토링 하는 방향으로 하자.