aligns a flex container’s lines within when there is extra space in the cross-axis
align-content only applies when there are mutiple lines of flex items
.container {
align-content: flex-start | flex-end | center | space-between | space-around | stretch;
}
Live Example
In the example above we are using align-content: center
to align the 2 wrapped rows of flex-items along the center of the cross-axis