Задать высоту (положение) блок с помощью CSS

[voraa]

С 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;
}

[voraa]

Рони, спасибо.
Заставил меня разобраться со своим кодом.
Проверил твой вариант на небольшом тестовом примере - работает.
Но я же так делал, черт подери. И ни фига не работало.

Просто глупость.
У меня все это вложено еще в один контейнер, и именно для него были установлены 20vw 60vh. А самому блоку который контейнер flex никаких размеров не задавал. Вот и не работало.

[рони]

voraa,
на всякий случай #1 строка 4 с ошибкой

heigth