Как заставить стройный дочерний компонент занять полную высоту страницы? ⇐ CSS

[Anonymous]

Я пытаюсь построить простой фронт-энды со стр., где у меня есть главная страница с различными возможными детскими компонентами. Моя проблема в том, что я не могу заставить дочерний компонент поднять полную высоту страницы. < /P>
Вот упрощенная версия моего кода: < /p>

import Child from './Prueba2.svelte';



.prueba {
flex: 1;
background-color: grey;
height: 100%;
}

footer {
background-color: red;
color: white;
text-align: center;
padding: 10px 0;
font-size: 0.9em;
}

.prueba_container {
display: flex;
flex-direction: column;
min-height: 100vh;
}

.child {
background-color: purple;
height: 100%;
}






Footer


< /code>
prueba2.svelte:

.prueba_child {
flex: 1;
background-color: orange;
height: 100%;
}


This should occupy the whole screen

< /code>
Я попытался установить Flex: 1 и высота: 100%, но, похоже, не работает, как и ожидалось. Div Prueba_child должен поднять полную высоту экрана, но это не так. Что я делаю не так, и как я могу заставить дочерний компонент занять полную высоту?

Подробнее здесь: https://stackoverflow.com/questions/791 ... f-the-page