Некоторые основные понятия CSS-флекса, важные для веб-дизайна:

• Флекс-контейнер. 4 Элемент, к которому применяется свойство display: flex. 4 Вложенные в него элементы подчиняются правилам раскладки флексов. 4
• Флекс-элемент. 4 Элемент, вложенный во флекс-контейнер. 4
• Главная ось. 35 Направление, в соответствии с которым располагаются все дочерние элементы флекс-контейнера. 5 По умолчанию течёт по горизонтали слева направо. 3
• Поперечная ось. 35 Направление, перпендикулярное главной оси. 5 Если главная ось горизонтальна, поперечная идёт сверху вниз, а если главная вертикальна, то поперечная направлена слева направо. 3
• justify-content. 35 CSS-свойство, которое распределяет элементы по главной оси. 3 Принимает следующие значения: flex-start, flex-end, center, space-between, space-around, space-evenly. 3
• align-items. 35 CSS-свойство, которое отвечает за выравнивание элементов по поперечной оси. 3 По умолчанию у него значение stretch, то есть элементы растягиваются вдоль всей оси. 3
• flex-wrap. 3 Свойство, которое отвечает за перенос строк во флекс-контейнере. 3 По умолчанию у свойства стоит значение no-wrap, то есть перенос запрещён. 3
• flex-basis. 5 Базовый размер отдельно взятого flex-блока. 5 Задаёт изначальный размер по главной оси для flex-блока до того, как к нему будут применены преобразования, основанные на других flex-факторах. 5