Flexbox demo

Flexbox Demo #1

flex-grow: 1

flex-grow: 1

flex-grow: 1

flex-grow: 1

flex-grow: 1

Flexbox Demo #2 (justify-content:space-around)

Flexbox Demo #3 (justify-content:space-between)

Flexbox Demo #4 (justify-content:space-evenly)

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

1

2

3

4

5

Flexbox Demo #6 (flex-wrap: wrap;)

flex-grow:1;

flex-grow:1;

flex-grow:1;

flex-grow:1;

flex-grow:1;

Flexbox Demo #7

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%;