1. main axis #

Created Wednesday 02 September 2020

Main axis = direction of flex. justify-content controls components along the main axis.

It has 6 values (modes):

1. center → all components stacked at the center, same space on both ends.
2. flex-start → all components stacked at the start
3. flex-end → all components stacked at the end
4. space-between → All elements have the same space between them. No space at the two ends.
5. space-around → Same as space between but, there’s space/2 space at the ends too.
6. space-evenly → Distributes the space evenly, with space at the ends too.

Picture #