TG Telegram Group & Channel
Frontend разработчик | United States America (US)
Create: Update:

🎯 CSS tip: как избавиться от :last-child и упростить отступы

Когда нужно задать отступ между элементами, но не последнему, часто пишут:


.item:not(:last-child) {
margin-bottom: 16px;
}


Но есть современный способ без селекторов и костылей 👇

Используй gap с flex или grid:


.container {
display: flex;
flex-direction: column;
gap: 16px;
}


📌 Преимущества:
– Нет нужды в :last-child
– Чище HTML и CSS
– Работает одинаково в любом направлении (row, column)
– Поддерживается во всех современных браузерах


Итог: если ты всё ещё пишешь :not(:last-child) — пришло время обновить подход.

👉 @frontend_1

🎯 CSS tip: как избавиться от :last-child и упростить отступы

Когда нужно задать отступ между элементами, но не последнему, часто пишут:


.item:not(:last-child) {
margin-bottom: 16px;
}


Но есть современный способ без селекторов и костылей 👇

Используй gap с flex или grid:


.container {
display: flex;
flex-direction: column;
gap: 16px;
}


📌 Преимущества:
– Нет нужды в :last-child
– Чище HTML и CSS
– Работает одинаково в любом направлении (row, column)
– Поддерживается во всех современных браузерах


Итог: если ты всё ещё пишешь :not(:last-child) — пришло время обновить подход.

👉 @frontend_1


>>Click here to continue<<

Frontend разработчик




Share with your best friend
VIEW MORE

United States America Popular Telegram Group (US)