justify-content
justify-content 속성은 콘텐츠의 좌우 관계 정렬 상태를 정의합니다.
justify-content
justify-content 속성은 콘텐츠의 좌우 관계 정렬 상태를 정의합니다.
정의(Definition)
- justify-content 속성은 콘텐츠의 좌우 관계 정렬 상태를 정의합니다.
- justify-content 속성은 콘텐츠의 좌우 관계 정렬 상태를 정의하고 align-content 속성은 콘텐츠의 상하 관계 정렬 상태를 정의합니다.
- justify-content 속성은 display:flex; 상태에서 적용됩니다.
문법(Syntax)
justify-content : flex-start | flex-end | center | space-between | space-around
속성(Property)
| 속성값 | 설명 |
|---|---|
| flex-start | 요소의 정렬 상태를 왼쪽(기본)으로 설정합니다. |
| flex-end | 요소의 좌우 정렬 상태를 오른쪽 끝점으로 설정합니다. |
| center | 요소의 좌우 정렬 상태를 가운데로 설정합니다. |
| space-between | 요소와 요소사이의 간격을 왼쪽과 오른쪽을 기준으로 설정합니다. |
| space-around | 요소와 요소사이의 간격을 가운데를 기준으로 설정합니다. |
| inherit | justify-content의 속성 값을 상위요소한테 상속받습니다. |
호환성(Compatibility)
 |
 |
 |
 |
 |
 6 |
 7 |
8 |
 9 |
 10 |
 11 |
 |
 |
 |
|
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| justify-content | 사용가능 | 사용가능 | 사용가능 | 사용가능 | 사용가능 | 사용안됨 | 사용안됨 | 사용안됨 | 사용안됨 | 사용안됨 | 사용가능 | 사용가능 | 사용가능 | 사용가능 |
