Как растянуть соседний блок параллельно основному?
Суть в том, что есть навигация с категориями, и при наведении выпадают подкатегории, как сделать чтобы блок с подкатегориями растягивался параллельно блоку с категориями? Пробовал через flex-direction: column; и flex-grow: 1;, но не помогло. Пример кода на codepen
Дополнительно:
Ответы:
Если я правильно понял задачу:
snippet
- все-равно зазор есть(
- мне кажется этот блок справа ( блок с категориями ) должен быть стики ?
- szQocks, неа, он должен совпадать по высоте с блоком с категориями.. а категорий может быть разное кол-во
- ne-programmist, ппц там конечно и разметка и стили - полное дерьмо, переверстай это лучше
- szQocks, +
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для растяжения соседнего блока параллельно основному блоку на веб-странице, можно использовать CSS свойство flexbox. Flexbox позволяет легко управлять распределением пространства между элементами внутри контейнера.
Для этого необходимо создать контейнер, в котором будут располагаться основной и соседний блоки. Затем применить следующие стили к контейнеру:
.container { display: flex; } .main-block { flex: 1; /* Основной блок занимает всю доступную ширину */ } .side-block { flex: 1; /* Соседний блок занимает также всю доступную ширину */ }
В данном примере оба блока будут растянуты параллельно друг другу и займут всю доступную ширину контейнера. При этом, если необходимо задать конкретную ширину для каждого блока, можно указать значение в пикселях или процентах вместо "flex: 1".
Таким образом, используя flexbox, можно легко управлять распределением пространства между блоками на веб-странице и добиться желаемого визуального эффекта.