Задать высоту (положение) блок с помощью CSS
С CSS я не на ты.
Может, кто поможет. Задачка на первый взгляд простая. <style> .extdiv { width: 20vw; heigth: 60vh; } .intdiv1 { width:100%; } .intdiv2 { width:100%; overflow-y: auto; } </style> <div class="extdiv"> <div class="intdiv1"> Немного бла-бла-бла </div> <div class="intdiv2"> Довольно много бла-бла-бла Довольно много бла-бла-бла Довольно много бла-бла-бла Довольно много бла-бла-бла Довольно много бла-бла-бла Довольно много бла-бла-бла Довольно много бла-бла-бла </div> </div> Див extdiv имеет вполне определенные, но не постоянные размеры (20vw 60vh) Поэтому могут непредсказуемо меняться. К тому же эти 20 и 60 тоже могут меняться в зависимости от media в CSS Высота intdiv1 определяется содержимом. Может меняться, но заведомо небольшая (<40%) Необходимо, что бы intdiv2 начинался сразу за intdiv1 и заканчивался в конце extdiv. Нужно с помощью CSS (С JS замотаешься ловить в какой момент меняется содержимое intdiv1 и его высота) Позиционирование - любое, флексы, гриды.... |
voraa,
как вариант ... .extdiv { width: 20vw; height: 60vh; display: flex; flex-direction: column; } .intdiv1 { width:100%; } .intdiv2 { width:100%; flex: 0 1 1; overflow-y: auto; } |
Рони, спасибо.
Заставил меня разобраться со своим кодом. Проверил твой вариант на небольшом тестовом примере - работает. Но я же так делал, черт подери. И ни фига не работало. Просто глупость. У меня все это вложено еще в один контейнер, и именно для него были установлены 20vw 60vh. А самому блоку который контейнер flex никаких размеров не задавал. Вот и не работало. |
voraa,
на всякий случай #1 строка 4 с ошибкой Цитата:
|
Часовой пояс GMT +3, время: 21:06. |