Как работает Flexbox?

Flexbox — одномерная система раскладки (строка или столбец). display: flex на контейнере, flex-direction задаёт направление. justify-content — выравнивание по главной оси, align-items — по поперечной. flex-wrap разрешает перенос. На детях: flex-grow (растягивание), flex-shrink (сжатие), flex-basis (базовый размер). Короткая запись: flex: 1 = flex: 1 1 0. align-self переопределяет align-items для конкретного элемента. gap работает как в Grid.