Как выровнять по центру css flex

Чтобы выровнять элементы по центру в flex-контейнере, необходимо использовать свойство justify-content и задать ему значение center. Например:

.container {
  display: flex;
  justify-content: center; /* выравнивание по центру */
}

Также можно использовать свойство align-items для выравнивания элементов по вертикали (по центру в данном случае):

.container {
  display: flex;
  justify-content: center; /* выравнивание по горизонтали */
  align-items: center; /* выравнивание по вертикали */
}

Обратите внимание, что выравнивание по центру работает только в главной оси, которая по умолчанию является горизонтальной. Если нужно выровнять элементы по центру по вертикали, то может потребоваться изменить направление главной оси на вертикальную с помощью свойства flex-direction: column;.