유연한 박스 모델(Flexible Box Model) HTML 태그들은 기본적으로 BOX 모델이 적용되며 세로로 적층하게 된다. 이를 가로로 배치하기 위해서 가장 널리 사용되는 방법이 float 속성을 이용해서 요소를 띄워주고 clear 속성으로 마무리하는게 일반적인데 부모 컨테이너의 생각과 달리 자식이 배치를 결정하기 때문에 억지스럽고 코드도 복잡해진다. CSS3에서는 flex라는 새로운 display 설정값이 나와서 가로 배치를 한결 손쉽게 처리할 수 있게 되었다. flex container적용하기 먼저 부모 요소에서 진행하느 설정에 대해 알아보자. flex는 display 속성의 값으로 상위 컨테이너가 자식을 어떻게 배치할 지 설정한다. 사용 가능한 값으로는 flex 또는 inline-flex가 있..