What is the CSS property align-items used for and what values can it have?

The align-items defines the alignment of the flex items within the flex-container when the items are wrapped/when there are multiple rows (or columns) on the main axis.

The property can have the following values:

• stretch - items are stretched to fit the container
• center - items are positioned at the center of the container
• flex-start - items are positioned at the beginning of the container
• flex-end - items are positioned at the end of the container
• baseline - items are positioned at baseline of the container

div {
  display: flex;
  align-items: center;
}