Современный способ центрирования с place-items Центрировать элемент… — Frontend разработчик

Frontend разработчик@frontend_1 · 10.5K subscribers Open in TelegramOpen

🎯 Современный способ центрирования с place-items

Центрировать элемент — базовая задача, но многие до сих пор пишут лишнее:

❌ Старый способ с Flexbox:


display: flex;
justify-content: center;
align-items: center;

✅ Новый минималистичный способ с Grid:


display: grid;
place-items: center;

📌 place-items — это сокращение для align-items + justify-items. Работает только с CSS Grid, но зато:

* Меньше кода
* Более читаемо
* Идеально для одиночных элементов в контейнере

💡 Подходит для модалок, карточек, лоадеров и др.

⚙️ Поддержка: все современные браузеры (даже IE11 частично поддерживает place-items как -ms-grid)

Пробуй — и забудь про лишние строки!

📲 Мы в MAX

👉 @frontend_1

t.me/frontend_1/4314 Translate