Можно ли прокрутить содержание Div между еще 2 гибкими Div? ⇐ CSS

[Anonymous]

У меня есть шарнирная полоса (#a), застрявшая сверху, и в нижней части страницы застрял в нижней части страницы. Каждый имеет фиксированную высоту 30px и представлен здесь желтым цветом. Они застряли там по следующему коду: Дисплей: Flex; Align-Content: Space-between; .
Между этими 2 Div есть красный Div с содержанием страницы (#B), который больше, чем размер экрана. Моя цель состоит в том, чтобы позволить этому красному Div занять только оставшееся пространство экрана, сохранить эту высоту и прокрутить его содержание. Но когда я установил переполнение: прокрутка Прокрутка появляется без эффекта. Но прежде чем прыгнуть к этим альтернативам, я хочу знать, возможно ли текущий сценарий.

Код: Выделить всё

body {
margin:0px;
}

#container {
max-width: 100vw;
max-height: 100vh;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-align-content: space-between;
align-content: space-between;
}

#A {
width: 100%;
height: 30px;
}

#B {
display:inline-block;
width: 100%;
overflow: scroll;
}

#C {
width: 100%;
height: 30px;
}< /code>








text
text
text
text
text
text
text
text
text

text
text
text
text
text
text
text
text
text

text
text
text
text
text
text
text
text
text

text
text
text
text
text
text
text
text
text

text
text
text
text
text
text
text
text
text

text
text
text
text
text
text
text
text
text

Подробнее здесь: https://stackoverflow.com/questions/352 ... -flex-divs