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

Для выравнивания элемента по вертикали можно использовать свойство display: flex и его дочернее свойство align-items: center. Например:

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

Это выровняет все дочерние элементы контейнера по вертикали. Если нужно выровнять только один элемент, можно задать ему свойство margin: auto. Например:

.container {
  height: 200px;
  display: flex;
}

.item {
  margin: auto;
}

Это выровняет элемент с классом .item по вертикали внутри контейнера с классом .container.