<tfoot> height 100% (rozciągniecie ostatniego wiersza tabeli na cala wolna resztę strony)

Witam

Chcialem sie nauczyc programowac na przykladzie wlasnej strony, zaczalem od tworzenia szablonu.

Chcialbym rozciagnac <tfoot> na cala wolna pionowa przestrzen strony, ale poleglem, nie wiem jak i prosze was o pomoc. (Rozciagnac czyli zeby dolne niebieskie pole z napisem “do rozciagniecia” wypelnilo cala nie wykozystana pionowa przestrzen np monitora. height na 100% nie dziala)

tutaj link do edytora z plikami jak narazie tylko index.html oraz main.css

https://codepen.io/ikswezclam/project/editor/AkkmWQ

https://www.w3schools.com/tags/att_th_colspan.asp

PS. Od około 20 lat nie robi się interfejsów w tabelkach, tabele służą tylko do wyświetlania danych tabelarycznych (poczytaj o sematic code). Druga rzecz która rzuciła mi się w oczy to odstępy/dopełnienia, nie rób ich przy pomocy tagu br tylko przy pomocy CSS margin lub padding.
Traktuj to jako code review, a nie wytykanie błędów celem “zgnojenia”.

1lajk

Dzieki za wypowiedz.

Nie wiem dlaczego podales odnosnik do colspan, nie to bylo tematem pytania.

Owa tabela ma wylistowac zawartosc wybranego folderu (tutaj nazwy zdjec z ich wlasciwosciami) dlatego zdecydowalem sie na tabele, myslisz ze zrobienie togo w divach bedzie lepsze ?

<br> uzylem tylko by wizualnie latwiej bylo wam znalesc obszar ktory chce rozciagnac.

Źle zrozumiałem problem, myślałem, że chcesz rozciągnąć w poziomie - mój błąd.

Dane mogą zostać w tabeli, ale dolne menu robiłbym już w nav>ul>li, również nie robiłbym breadcrumbsów u góry w tabeli.

Wracając już do problemu, będziesz miał trochę ciężko to zrobić. Wydaje mi się, że najlepiej będzie użyć może flex lub grida. Ale w takim przypadku tabela musi wylądować w div z ustaloną stałą wysokością i to on powinien dawać niebieskie tło dla tabeli.

Postaram się zaraz dodać jakiś przykładowy układ.

EDIT:
Przykład: https://jsfiddle.net/p4k51axw/

1lajk

Dziekuje pieknie, ogromny szacunek ze Ci sie chcialo.

Lubię takie łamigłówki bo pozwalają odświeżyć sobie wiedzę i informacje. Dodatkowo nie miałeś problemu z prostą sprawą - zwłaszcza jak się nie wie jak to zrobić to nie jest proste, no i co najważniejsze nie miałeś podejścia - zróbcie za mnie.

1lajk