Що таке Flexbox і чому його використовують?
Свайпніть щоб показати меню
Flexbox, скорочено від Flexible Box Layout, — це модуль CSS, розроблений для спрощення вирівнювання, розподілу та організації елементів у межах контейнера.
Flexbox використовує відношення батьківського та дочірнього елементів. Батьківський елемент називається flex-контейнером, який керує розташуванням. Дочірні елементи називаються flex-елементами, розмір, позицію та порядок яких можна контролювати за допомогою властивостей flexbox.
Flexbox поводиться інакше, ніж блочні та рядкові елементи. На відміну від блочних елементів, flex-елементи не розташовуються вертикально; за замовчуванням вони вирівнюються у ряд або стовпець. Крім того, відступи по краях контейнера не виходять за його межі.
Flexbox у дії
Flexbox працює шляхом вирівнювання елементів уздовж осей flex-контейнера. Щоб увімкнути Flexbox, достатньо застосувати властивість display: flex; до батьківського елемента. Після цього можна налаштовувати вирівнювання та розподіл елементів у контейнері.
index.html
index.css
Дякуємо за ваш відгук!
Запитати АІ
Запитати АІ
Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат