Flexbox Demo

Flexbox Demo Number 1

flex-grow: 1;

flex-grow: 1;

flex-grow: 1;

flex-grow: 1;

flex-grow: 1;

Flexbox Demo Number 2 (justify-content: space-around;)

Flexbox Demo Number 3 (justify-content: space-between;)

Flexbox Demo Number 4 (justify-content: space-evenly;)

Flexbox Demo Number 5 (flex-direction; row-reverse;)

1

2

3

4

5

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

flex-grow: 1;

flex-grow: 1;

flex-grow: 1;

flex-grow: 1;

flex-grow: 1;

Flexbox Demo Number 7

Flexbox Demo Number 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%;