몰랐어? 그럼알아
1.display: flex 분석하기
<div> 요소들은 별다른 설정을 해주지 않으면 위쪽에서부터 세로로 정렬되며,
가로로 넓게 공간을 차지하는 것을 확인할 수 있습니다.
2.flex-direction : 정렬 축 정하기
flex-direction 속성은 부모 요소에 설정해주는 속성으로,
자식 요소들을 정렬할 정렬 축을 정합니다. 아무 설정도 해주지 않으면 기본적으로 가로 정렬을 합니다.
3.flex-wrap : 줄 바꿈 설정하기
4.justify-content : 축 수평 방향 정렬
justify-content 속성은 자식 요소들을 축의 수평 방향으로 어떻게 정렬할 것인지 정합니다.
요소들이 가로로 정렬되어 있다면 가로 방향으론 어떻게 정렬할 것인지,
세로로 정렬되어 있다면 세로 방향으론 어떻게 정렬할 것인지 정하는 속성입니다.
5. align-items : 축 수직 방향 정렬
align-items 속성은 자식 요소들을 축의 수직 방향으로 어떻게 정렬할 것인지 정합니다.
요소들이 가로로 정렬되어 있다면 세로 방향으론 어떻게 정렬할 것인지,
세로로 정렬되어 있다면 가로 방향으론 어떻게 정렬할 것인지 정하는 속성입니다.
6.flex-grow
내가 한 거!