Задать вопрос
@denism300
flexbox

Как сверстать на flex?

Есть конструкция:

<div class="col-12 main-menu-wrap">
    <div class="fixed-menu-logo">
        <!-- тут содержимое блока -->
    </div>
    <div class="main-menu">
        <!-- тут содержимое блока -->
    </div>                
</div>

Блок fixed-menu-logo имеет стандартную ширину 40px.
Блок main-menu должен занимать все остальное место.
Как это сделать на flex?
  • Вопрос задан
  • 75 просмотров
Комментировать
Подписаться 1 Простой Комментировать
Решения вопроса 2
origami1024
@origami1024
went out for a night walk
родителю display: flex;
1му диву width: 40px;
2му диву flex: 1;

https://codepen.io/origami1024/pen/qBWarEq
Ответ написан
Комментировать
Комментировать
hisbvdis
@hisbvdis 
.main-menu-wrap {
    display: flex;
}

.fixed-menu-logo {
    flex-basis: 40px;
}

.main-menu {
    flex-grow: 1;
}
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Backend PHP Разработчик
Integrilla
от 120 000 ₽
PHP Разработчик - Team Lead
Integrilla
от 150 000 ₽
Программист SQL
САМО-Софт • Москва
До 220 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Анимация логотипа
24 апр. 2024, в 00:08
20000 руб./за проект
Разработка дизайна раздела «Статьи» на сайте «Мир отходов»
23 апр. 2024, в 23:01
10000 руб./за проект
Дизайн личного кабинета (клиентская часть)
23 апр. 2024, в 22:37
500 руб./в час
Ещё заказы