Як вирівняти елемент індивідуально?
Для індивідуального вирівнювання одного flex-елемента використовується властивість:
javascript
align-selfЦя властивість перевизначає align-items, але лише для конкретного елемента. Приклад:
css
.item {
align-self: center;
}Можливі значення збігаються зі значеннями align-items:
javascript
align-self: auto | flex-start | flex-end | center | baseline | stretch;Також, якщо потрібно вирівняти елемент по головній осі індивідуально, можна використати margin: auto;: це окремий прийом, який дозволяє «відштовхнути» елемент від інших у потрібний бік. Наприклад:
css
.item {
margin-left: auto; /* відсунути елемент праворуч у row-напрямку */
}Підсумок
| Властивість | Для чого |
|---|---|
align-self | індивідуальне вирівнювання по поперечній осі |
margin:auto | індивідуальне вирівнювання по головній осі (трюк для окремого елемента) |
Коротка відповідь
Для співбесідиPremium
Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.