Как растянуть блок на высоту радительского блока при условии что в нем есть блоки неизвестной высоты?

Question

[MasterCopipaster]

Всем доброе время суток, хотел поинтересоваться у мастеров верстки как решить следующею проблему:
У меня есть родительский блок flex который растянут до низа страницы.
В нем есть два блока сверху в моем примере это блоки с текстом [.text-block-1 , .text-block-2 ] И идет блок со скролингом который должен быть растянут на всю свободную высоту родителя [.text-block-3] , а после него идет блок который должен быть прижат к низу родителя [.text-block-7]. Когда я применяю h-100 (это стандартный стиль бутстрапа) или height: 100%; он растягивается но т.к. он считает высоту родителя, то к общей высоте добавляются еще блоки снизу и сверху, и таким образом получается что он растягивается на 100% + высота других блоков в этом родительском блоке. Собственно выглядит это так:


Лишний отступ как раз равен сумме высоты других блоков...
Что я бы хотел сделать:

Хочу что бы .text-block-3 занимал все пустое место в родителе по середине по высоте, за вычетом других блоков как на картинке. Если в нем контента больше чем он может внести он должен скролится.
Собственно как реализовать такое поведение блока?
Пример верстки: https://jsfiddle.net/s01pv78e/1/

Answer 1

[Виталий Першин]

Например так: