Align Content

Align multiple lines of flex items along the 'cross-axis'. This property is to be used in conjunction with the flex-wrap property. It only takes effect when rows or columns of flex items wrap over multiple (horizontal or vertical) lines. And so align-content will not take effect if flex-wrap is set to 'nowrap'.

Value Description
stretchDefault value. Lines stretch to take up the remaining space
flex-startLines bunch toward the center of the flex container
centerLines bunch toward the start of the flex container
flex-end Lines bunch toward the end of the flex container
space-betweenLines are spaced, but flush against the edges of the container.
space-aroundLines are spaced, and there is half-size space between the edges of the container

Themeover CSS Reference