Flexbox 6 - Flex Wrap

flex-wrap specifies what to do when the parent is too narrow or short to fit the children without reducing their size.

1
2
3
4
5
6
7

6-1. Parent is set to flex-wrap : nowrap;

1
2
3
4
5
6
7

6-2. Parent is set to flex-wrap : wrap;

1
2
3
4
5
6
7

6-3. Parent is set to flex-wrap : wrap-reverse;