display: flex
flex-direction
column | column-reverse | row | row-reverse
default: row
row
1
2
3
4
5
row-reverse
1
2
3
4
5
column
1
2
3
4
5
column-reverse
1
2
3
4
5
flex-wrap
nowrap | wrap | wrap-reverse
default: nowrap
nowrap
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
wrap
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
wrap-reverse
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
flex-flow
flex-direction flex-wrap
default: row nowrap
justify-content
flex-start | flex-end | center | space-between | space-around
default: flex-start
flex-start
1
2
3
4
5
flex-end
1
2
3
4
5
center
1
2
3
4
5
space-around
1
2
3
4
5
space-between
1
2
3
4
5
align-items
stretch | flex-start | flex-end | center | baseline
default: stretch
items_stretch
1
2
3
4
5
flex-start
1
2
3
4
5
flex-end
1
2
3
4
5
center
1
2
3
4
5
baseline
1
2
3
4
5
align-content
stretch | flex-start | flex-end | center | space-between | space-around
default: stretch
stretch
1
2
3
4
5
6
7
8
9
10
flex-start
1
2
3
4
5
6
7
8
9
10
flex-end
1
2
3
4
5
6
7
8
9
10
center
1
2
3
4
5
6
7
8
9
10
space-between
1
2
3
4
5
6
7
8
9
10
space-around
1
2
3
4
5
6
7
8
9
10
order
number
detault is the source order
1
2
3
4
5
flex-grow
number
default: 0
1
2
3
4
5
1
2
3
4
5
1
2
3
4
5
flex-shrink
number
default: 1
1
2
3
4
5
flex-basis
auto | width
default: auto
1
2
3
4
5