Как задать таблице 100% высоту?

Question

[aaltqna]

Есть таблица в такой разметке: https://codepen.io/aaltcode/pen/LYewNrO

Если div.table-responsive установить конкретную высоту, то получится то, что необходимо. Проблема в том, что высота должна быть 100% от родительского контейнера, а так не работает. Ни с display: flex, никак иначе. Единственное решение - это устанавливать высоту через js, высчитывая доступное место для заполнения всей высоты. Однако данная таблица рендерится еще и в модальном окне, поэтому универсального решения сделать не получилось и снова вернулся к css.

Нет вообще что ли способа задать таблице 100% высоту? Изменения свойства display на другое не подходит, т.к. ломает ширину колонок.

Answer 1

[Антон Антон]

Там не структура документа, а издевательство. но как-то так:
https://codepen.io/FragsterAt/pen/WNyemeN

Comments

[aaltqna]

По ссылке ведь закомментированы большинство tr. Если их раскомментировать, то не работает. Логика понятна, везде проставлять height: 100% и display: flex, но я вот уже третий день их кручу и с большим кол-вом tr это все игнорируется.

[Антон Антон]

aaltqna, что значит "с большим количеством tr не работает?" работает. Ничего ни на что не наезжает. или надо, чтобы таблица прокручивалась внутри блока, не растягивая все остальное?

[aaltqna]

Антон Антон, да, таблица со скроллом. По ссылке все работает только, чтобы растянуть таблицу на всю высоту. По большей части такое даже и не нужно, хотя и относится тоже к 100% высоте.

Цель вот такого добиться:

[Антон Антон]

aaltqna, ну тогда так (обновил ответ)