flex box에는 두 개의 아이들이 있다. 흐어엉? 과연 두 아이가 누구인가! flex box에는 main axis 와 cross axis가 있다. 이 둘은 수직을 이루지 ㅋ
display : flex;를 했을때 /flex-direction:row;/ main axis는 수평(horizontal)이고 cross axis는 vertical이다.
main axis → main axis가 수평일 때, 이 main axis에 적용할 수 있는 속성이 있다. 그것은 바로 justify-content이다.
justify-content→ justify -content는 수평에 있는 아이템들을 요리조리 이동할 수 있다.
cross axis → cross axis가 수직일 때엔, 또 다른 속성을 적용할 수가 있다.
align-items→ align-items는 수직에 있는 아이들을 요리조리 이동할 수가 있다. 근데 위에있는 justify-content와는 또 다른 속성을 가지고 있는 아이라, 별개라고 생각해주면 된다.