Как использовать свойство align-items для выравнивания элементов в CSS Flexbox?

Свойство align-items в CSS Flexbox используется для выравнивания элементов по поперечной оси. htmlacademy.ru itchief.ru

По умолчанию у него значение stretch, то есть элементы растягиваются вдоль всей оси. htmlacademy.ru Другие значения:

• flex-start — элементы идут в начале оси; htmlacademy.ru
• flex-end — элементы идут в конце оси; htmlacademy.ru
• center — элементы в центре оси; htmlacademy.ru
• baseline — элементы размещены по базовой линии. htmlacademy.ru

Пример использования: если применить align-items: center к флекс-контейнеру, то все флекс-элементы выровняются по центру оси блока. webref.ru

Поскольку это настройка по умолчанию, любой из флекс-элементов может переопределить выравнивание с помощью свойства align-self. webref.ru