Jak ustawić poprawnie footer

0

Witam serdecznie ;)

Chciałbym aby zawartość strony wypełniała w pełni okno przeglądarki. Footer powinien być na dole strony, a zostaje puste miejsce pod nim. Kombinuję i już mi brak pomysłu jak poprawnie to zrobić.

http://sapphire-webmasters.com/Account/Login

Proszę o pomoc =/

0

Możesz rozwiązać to np dopisując do footer

position: fixed;
bottom: 0;
width: 100%;

Ewentualnie absolute zamiast fixed

//
fixed będzie lepsze

0

Dzięki za zainteresowanie.

Znam to zastosowanie, jednak nie o takie rozwiązanie mi chodzi ;) Fixed i absolute odpadają.

Przy zastosowaniu fixed trzeba uwzględnić padding-bottom równy footerowi na zawartości strony bo przy dłuższej treści footer będzie przysłaniał content.

Pozdrawiam

1

Czy chodzi Ci o to, żeby stopka przylegała do dolnej części okna przeglądarki jeśli content nie wypełnia strony a jeśli wypełnia to ma być tradycyjnie pod content'em?

W innym razie (jeśli chcesz żeby strona zawsze zajmowała 100% wysokości okna) musisz pobawić się wysokością głównych kontenerów (navbar, body-content, footer).
Możesz użyć jednostek vh (viewport height) ale to nie jest łatwe szczególnie jeśli strona ma być responsywna bo na każdym ekranie będzie to inaczej wyglądać i ciężko wszystko spasować.

0
SzyQ napisał(a):

Czy chodzi Ci o to, żeby stopka przylegała do dolnej części okna przeglądarki jeśli content nie wypełnia strony a jeśli wypełnia to ma być tradycyjnie pod content'em?

Zgadza się

0

Możesz pobawić się ustawieniem min-height dla content ale to też nie będzie optymalne rozwiązanie.
Może to Ci pomoże, ale będzie pewnie wymagało przebudowy szablonu. https://chrisbracco.com/css-sticky-footer-effect/

1

kiedyś mi mignął podobny temat na stacku o bootstrapie, bodaj "sticky footer" weź wygoogluj

1 użytkowników online, w tym zalogowanych: 0, gości: 1