
1. 다른 항목을 기준으로 축소되는 방법을 제어
2. items
2.1. order
2.1.1. [ integer ]
2.1.2. 아이템의 순서를 제어 ex) 1,2,3
2.2. flex-grow
2.2.1. [ number ] * default 0
2.2.2. 다른 항목을 기준으로 확대되는 방법을 제어
2.3. flex-shrink
2.3.1. [ number ] * default 1
2.4. flex-basis
2.4.1. [ length ] | auto * default auto
2.4.2. 항목의 초기 기본 크기
2.5. flex
2.5.1. [ flex-grow | flex-shrink | flex-basis ]
2.5.2. 단축형 속성
2.6. align-self
2.6.1. [ auto | flex-start | flex-end | center | baseline | stretch ]
3. container
3.1. justify-content
3.1.1. [ flex-start | flex-end | center | space-between | space-around ]
3.1.2. 주축에 따라 항목을 맞추는 방법을 설정
3.2. align-items
3.2.1. [ flex-start | flex-end | center | baseline | stretch ]
3.2.2. 교차축에 따라 항목을 맞추는 방법을 설정
3.3. align-content
3.3.1. [ flex-start | flex-end | center | space-between | space-around | stretch ]
3.3.2. justify-content와 유사하나 여러줄이 있을 경우 정렬을 설정
3.4. flex-direction
3.4.1. [ row | row-reverse | column | column-reverse ]
3.4.2. 기본축의 방향을 설정
3.5. flex-wrap
3.5.1. [ nowrap | wrap | wrap-reverse ]
3.5.2. 자식요소를 단일 또는 복수행이나 열로 줄바꿈할지 결정
3.6. flex-flow
3.6.1. [ flex-direction | flex-wrap ]
3.6.2. 단축형 속성
4. 제목없음
4.1. align-items를 재정의
4.2. 주축 : Main Axis
4.3. 교차축 : Cross Axis
4.4. direction 속성값에 따라 주축과 교차축은 변함
5. Description
5.1. 변천사
6. 속성값 이해 between : 중간에, around : 주위에
7. Bookmark
7.1. Generater
7.1.1. 구버전도 제공
7.2. slide
7.3. Link
7.3.1. 유연한 상자 레이아웃
7.4. Video
7.4.1. Leveling Up With Flexbox
8. Bug
8.1. CSS flex: Webkit, Android 2.1~4.3, IE 10 문제 해결.
8.2. flex bug 모음
9. Support
9.1. 2009 syntax - display:box
9.1.1. android 4.3이하(Stock브라우저)
9.1.2. iOS 6.1이하
9.1.3. Chrome 20이하
9.1.4. Firefox 21이하
9.2. Final syntax - display:flex
9.2.1. android 4.4이상
9.2.2. android 4.3이하(크롬브라우저)
9.2.3. iOS 7.1이상
9.2.4. internet explorer 11
9.3. 2011 hybrid syntax - display:flexbox
9.3.1. internet explorer 10