Stopka (na dole)

pytanie zadane 17 września 2017 w HTML i CSS przez Veqraav Nowicjusz (120 p.)

Zrobiłem sobie stronkę na nowych znacznikach html5 (header, main, section itp.), no i wszystko ładnie, pięknie. Ale stopka jest cały czas przyklejona do divów oznaczających nawigację (float: left) i treść danej podstrony z nawigacji (float: left). Chcę stopkę od tego rozdzielić żeby była na dole strony pomimo tego ile jest tekstu na danej podstronie. Nie chodzi o to żeby była cały czas na ekranie (position: fixed), tylko żeby była na samym dole tak jakby przyklejona ale żeby cały czas tam była.

komentarz 17 września 2017 przez criss Mędrzec (172,590 p.)

Nie ta kategoria :P (możesz zmienić edytując)

komentarz 17 września 2017 przez Veqraav Nowicjusz (120 p.)

Nie zauważyłem (pierwszy raz na forum), poprawione.

4 odpowiedzi

odpowiedź 17 września 2017 przez xmentor Nałogowiec (49,520 p.)

Spróbuj tego

komentarz 17 września 2017 przez Frenoo Nowicjusz (120 p.)

pls o pomoc czym poprzedzić zapis

<a href='domena.pl'>....</a> by link w stopce ukazywał się tylko na stronie głównej?

odpowiedź 17 września 2017 przez Alex.Ironside Stary wyjadacz (14,900 p.)

Primo podaj kod.

Secundo najlepiej dodaj do jsfiddle albo codepen.

I po trzecie sprobuj

body{min-height:100vh;}
footer{bottom: 0;}

komentarz 17 września 2017 przez Veqraav Nowicjusz (120 p.)

https://jsfiddle.net/bsp02qxs/

komentarz 17 września 2017 przez Alex.Ironside Stary wyjadacz (14,900 p.)

Zobacz co podeslal xmentor

odpowiedź 17 września 2017 przez turtelian Obywatel (1,760 p.)

position absolute i dac bottom 0 ? jesli o to ci chodzi :) bo z tego jsfiddle nie umiem korzystac,

Również można dac sticki bottom. (moim zdaniem najlepiej tak to wyglada) bo dokladnie nie wiem o co ci chodzi :)
dodaj do footera :
position:sticky;

bottom:0px;(czy ile tam chcesz wtedy stopka bedzie przyczepiona caly czas do dolu ekranu.

komentarz 17 września 2017 przez Veqraav Nowicjusz (120 p.)

No właśnie nie chcę żeby stopka była cały czas przyklejona do strony i żeby razem z przewijaniem cały czas chodziła albo na dół albo na górę, tylko żeby była na dole jak na stopke przystało nawet gdy jest mało tekstu, bo jak widać w tym jsfiddle gdy nie ma w ogóle tekstu to ona jest przyklejona do divów, a nie chcę żeby tak było.

Np nawigacja jest odklejona od loga, a treść jest odklejona od nawigacji, ale już stopka jest przyklejona nie wiem dlaczego

komentarz 17 września 2017 przez turtelian Obywatel (1,760 p.)

ciezko tak bez kodu a ten jsfiddle jest do dupy bo zmain nie mozna robic w locie ale sproboj w takim razie do body dodac height 100%vh
jakbys mogl wrzucic kod w cos co ma rozum i godnosc czlowieka np codepen ;)

komentarz 17 września 2017 przez turtelian Obywatel (1,760 p.)

z tego co na szybko popatrzylm w tym jsfidle to nie czyscisz nigdzie floatleftu

sproboj na poczatku stopki dac clear both :)
PS: kod mega nieczytelny i do tego ten jsfiddle :)

komentarz 17 września 2017 przez Veqraav Nowicjusz (120 p.)

Masz tutaj - https://codepen.io/Boszcz/project/editor/DWbjVW

A clear w stopce dałem

komentarz 17 września 2017 przez turtelian Obywatel (1,760 p.)

cos zjebales z code penem i nie dziala jak powinno

odpowiedź 17 września 2017 przez cyklop123 Bywalec (2,790 p.)

Stwórz diva między stopką a znacznikami powyżej i daj mu styl

clear:both;

komentarz 17 września 2017 przez Veqraav Nowicjusz (120 p.)

O tak, tak. Teraz się oddzieliło od nich, a teraz jak zrobić żeby była na dole? Da się to zrobić innym sposobem niż position: absolute? Bo to niszczy cały układ jaki sobie zaplanowałem

komentarz 17 września 2017 przez cyklop123 Bywalec (2,790 p.)

Teraz użyj sposobu kolegi @xmentor

komentarz 17 września 2017 przez turtelian Obywatel (1,760 p.)

mozesz w cssie zrobic tak :
.all {
margin-top: 10px;
height: 65vh;
}
wtedy stopke masz na dole caly czas ale wysokosc tych elementow masz na sztywno ustawiona(ps: mowilem ze clearbotha brakuje :D)