Як flex-wrap впливає на вирівнювання елементів?
Коли flex-wrap увімкнений (wrap або wrap-reverse), у контейнері може з'явитися кілька ліній flex-елементів. У такому випадку:
justify-contentпродовжує вирівнювати елементи вздовж головної осі всередині кожного рядкаalign-itemsвирівнює елементи всередині одного рядка по поперечній осі- з'являється значення
align-content: воно керує вирівнюванням РЯДКІВ між собою, коли їх кілька
Коротко
| Властивість | Працює при wrap | Що вирівнює |
|---|---|---|
justify-content | так | елементи в рядку (по головній осі) |
align-items | так | елементи всередині рядка (по поперечній осі) |
align-content | лише якщо є кілька рядків | самі рядки (по поперечній осі) |
Висновок: flex-wrap сам по собі не вирівнює елементи, але він вмикає багаторядковий режим, через який починає відігравати роль align-content, що відповідає за розподіл рядків.
Коротка відповідь
Для співбесідиPremium
Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.