[CSS] Flexbox

inline block의 문제점을 해결하기 위해 flexblock가 나왔다.

✅ flexbox 사용 규칙

1. 자식 엘리먼트에는 어떤 것도 적지 말아야 함!
   자식 엘리먼트를 움직이게 하려면 부모 엘리먼트를 flex container로 만들어야 한다. (부모 css에 display: flex)
2. align-items : cross axis에서 작용 (수직)
3. justify-content : main axis에서 작용 (수평) (defalut)
   flex-container가 height를 가지고 있지 않으면 align-items를 사용하더라도 위치가 바뀌지 않음.
   vh = viewport height (스크린에 따라 다름 - mac, window, iPhone 등 기종에 따라 다르게 나옴)