Flexbox 2 - Vertical Alignment

We can use the align-items property to set how the children are spaced horizontally, otherwise known as the main axis.

2-1. align-items : flex-start;

2-2. align-items : center;

2-3. align-items : flex-end;

2-4. align-items : baseline;

2-5. align-items : stretch;

2-6. Mixing align-items and justify-content.

2-7. Mixing align-items and justify-content.