Как выровнять элементы по вертикали css flex

Чтобы выровнять элементы по вертикали в CSS Flexbox, можно использовать свойство align-items. Например, чтобы выровнять элементы внутри контейнера по центру по вертикали, нужно к контейнеру применить следующий CSS:

.container {
  display: flex;
  align-items: center;
}

Этот код выровняет элементы внутри контейнера по центру по вертикали, независимо от их высоты. Значение center для свойства align-items выравнивает элементы по центру контейнера. Можно также использовать другие значения для свойства align-items, например flex-start или flex-end для выравнивания элементов вверху или внизу контейнера.

Кроме того, можно использовать свойство justify-content, чтобы выровнять элементы по горизонтали в контейнере. Например:

.container {
  display: flex;
  align-items: center;
  justify-content: center;
}

Этот код выровняет элементы внутри контейнера по центру как по вертикали, так и по горизонтали.