CSS justify-content
CSS justify-content property is used in flex containers to align the flex items.
When using CSS justify-content property free spaces must be available.
CSS justify-content property values are
- flex-start - Items are placed at the beginning of the flex container.
- flex-end - Items are placed at the end of the flex container.
- start - If an element is not in a flex container, this can be used to place the item at the beginning of the container.
- end - If an element is not in a flex container, this can be used to place the item at the end of the container.
- center - Items are placed at the center of the container.
- space-between - Space is evenly distributed between the elements.
- space-around - Space is evenly distributed between the elements and its surroundings.