Code

Direction and Wrapping

Flex-direction and flex-wrap are flex properties which control the stacking of the content in the div class: Flex-direction controls the way the content stacks, and flex-wrap eithre allows or disallows multiple lines of content.

Flex-direction

Flex-direction controls the way your content stacks. Such a value for flex-direction would be row, meaning that the content stacks from left to right. Column would stack from top to bottom. Other values would be row-reverse and column-reverse. Here's an example:

This code yields the following result:

Flex-wrap

Flex-wrap determines whether or not items should wrap, or if they can go to multiple lines. There are two flex-wrap values: wrap and nowrap. Here's an example.

This code yields the following result: