[flex-box] justify-content

📄 justify-content

플렉스아이템들이 플렉스박스 주축을 따라 배치될 때,

요소 사이의 공간을 분배하는 방식을 결정합니다.

justify-content: flex-start; /* 기본값*/
justify-content: flex-end; /*순서는 그대로 유지한채 뒤로 붙음. 리버스가 아님.*/
justify-self: center; /*가운데 정렬*/
justify-content: space-around; /*요소들이 동일한 여백을 가진다.*/
justify-content: space-between; /*양끝에 여백 없이 요소들을 동일한 간격으로 펼친다.*/
justify-content: space-evenly; /*플렉스 컨테이너가 요소 사이에 동일한 여백을 만든다.*/

출처

• 유노코딩