Pomoc w prostym CCS :) Stopka na dół, Marsz!

pytanie zadane 23 kwietnia 2018 w HTML i CSS przez BirdA Początkujący (360 p.)
edycja 23 kwietnia 2018 przez BirdA

<div> -> 100% wysokości

<div></div> X wysokości

<div></div> Y wysokości

<div></div> -> W jaki sposób zrobić aby wysokość tego diva dopełniała do 100% względem rodzica?

</div>

Lub w jaki sposób rozciągnąć stopkę na dół ale tak by nie zostało puste miejsce między stopką a elementem wyżej. (wyżej jest div z 3 divami pionowo -> flex)

komentarz 23 kwietnia 2018 przez Tomek Sochacki Ekspert (227,530 p.)

wrzuć na codepen bo tak to można dyskutować, a czasami błąd może tkwić w zupełnie innym miejscu.

komentarz 23 kwietnia 2018 przez BirdA Początkujący (360 p.)
edycja 23 kwietnia 2018 przez BirdA

Nie ma błędu, chodzi mi o to, że przy małej ilości tekstu stopka jest na środku, a wszystkie sposoby jakie znalazłem powodowały przypinanie stopki na sztywno do dołu, wtedy powstaje puste miejsce - tło głównego kontenera.

https://codepen.io/anon/pen/bMEmba

Stopka ma iść na sam dół, a div z flexem ma się rozciągnąć.

Całość powinna być tyle samo co klasa html. Html oczywiście nie ma stałej wysokości.

1 odpowiedź

odpowiedź 24 kwietnia 2018 przez imklau Nałogowiec (42,090 p.)
wybrane 24 kwietnia 2018 przez BirdA

Najlepsza

Tutaj chyba spokojnie można wykorzystać flexa tylko mimo wszystko trzeba zmienić kierunek elementów na kolumny.

Podsyłam przykład, mam nadzieję, że widać, co tutaj się stanęło :D

komentarz 24 kwietnia 2018 przez BirdA Początkujący (360 p.)

Dobra, zrobiłem, musiałem kilka razy użyć tego flexa aby doprowadzić 100% height. Dziękuję za pomoc.

Jeszcze tylko pytanie: za co odpowiada druga jedynka: "flex: 1 1 100%"?