Code Ready | Frontend
Как отодвинуть элемент в конец без justify-content?
Частая задача — в одной строке есть несколько элементов, и один из них нужно прижать к правому краю. Обычно начинают оборачивать всё в дополнительные контейнеры.
.nav {
display: flex;
justify-content: space-between;
}
Но это ломает контроль над расстояниями между остальными элементами.
Есть более точечный и управляемый способ:
.push {
margin-left: auto;
}
auto-отступ забирает всё свободное пространство и отталкивает элемент вправо:
<nav class="nav">
<span>Logo</span>
<span class="push">Menu</span>
</nav>
Это работает не только для одного элемента, но и для групп:
.group {
margin-left: auto;
}
Теперь можно точно управлять layout без изменения поведения остальных элементов.
Один margin-left: auto заменяет сложные flex-настройки и даёт контроль над выравниванием.
Code Ready | #совет Если у вас установлено приложение,
вы можете сразу перейти в канал