Flexbox Demo

Flexbox Demo #1

flex-grow: 1

flex-grow: 1

flex-grow: 1

flex-grow: 1

flex-grow: 1

Flexbox Demo #2 (justify space-around)

Flexbox Demo #3 (justify space-between)

Flexbox Demo #4 (justify space-evenly)

Flexbox Demo #5 (felx-direction: row-reverse)

1

2

3

4

5

Flexbox Demo #6 (felx-wrap)

flex-grow: 1

flex-grow: 1

flex-grow: 1

flex-grow: 1

flex-grow: 1

Flexbox Demo #7 (felx-wrap)

flex-basis

Flexbox Demo #8

flex-basis: 25%

flex-basis: 25%

flex-basis: 25%

flex-basis: 25%

flex-basis: 25%

flex-basis: 25%

flex-basis: 25%

flex-basis: 25%