justify-content

justify-content: flex-start | flex-end | center | space-between | space-around | space-evenly | start | end | left | right

📝 Описание

Определяет выравнивание flex-элементов вдоль главной оси контейнера.

Значение по умолчанию: flex-start

🎯 Возможные значения

  • flex-start — элементы прижаты к началу
  • flex-end — элементы прижаты к концу
  • center — элементы по центру
  • space-between — равные промежутки между элементами
  • space-around — равные промежутки вокруг элементов
  • space-evenly — абсолютно равные промежутки
.flex-container {
  display: flex;
  justify-content: space-between;
}

🌐 Поддержка браузеров

Все современные браузеры

📚 Подробнее

Подробнее об этом свойстве вы можете узнать в нашем руководстве: Полное руководство по CSS Flexbox