Align Content

Align Content

inline

  • 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

JS Bin on jsbin.com

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