Lucrez la partea de front end a unui CMS, si am o pagina facuta custom, care, for some reason, are un footer care zboara in mijlocul pagini. Faza ciudata e ca browserul vede <body></body>-ul doar cu o parte din elemente… in cod m-am uitat si footerul are in el tagul de inchidere </body>
Pagina este https://getstreamhosting.com/vpn
Problema mea defapt este ca footerul zboara la mijlocul paginii, iar daca ii dau position:absolute; bottom:0; , footerul se deplaseaza la capatul de jos al body-ului pe care il considera browserul:
Nu e vina browserului ca iti considera body-ul doar pana acolo.
Cel mai probabil ai abuzat de position:fixed si position:absolute in mai multe locuri.
Inaltimea body-ului e data de inaltimea elementelor relative din interiorul sau neluand in calcul inaltimea elementelor absolute sau fixe.
Nu iti zboara pana la mijlocul paginii, dar la ce te astepti cand ii dai position:fixed footer-ului?
Position fixed inseamna ca te raportezi la dimensiunea ecranului si nu la dimensiunea paginii.
Fie vorba intre noi nu am vazut nici un website care sa aiba un footer cu position fixed.
Cand dai pozitie fixa unui element, obtii efectul de sticky ( ai in permanenta elementul intr-o pozitie specifica a ecranului, oricat de adanc ai scrolla in pagina ).
Asta e o rezolvare ca si cum ai pune celofan in locul geamului crapat.
Renunta in a mai folosi pozitii absolute direct in body. Daca vrei sa ii dai pozitie absoluta unui element, poti sa faci asta, dar in interiorul unui alt element relativ nu direct in interiorul body-ului.
Te-as sfatui sa arunci o privire peste tot ce inseamna position:relative, position:absolute si position:fixed, pentru ca altfel te vei tot adanci in problema si nu vei intelege exact care e problema.
nu vad de ce este ne voie de acel empty div.
a cam zis @BrCristian cam tot ce trebuia de zis. ai grija cu position pentru ca folosit gresit iti poate da foarte multe batai de cap.
Eu am primit deja facuta “opera de arta”…Ideea era sa rezolv bugul ala nu sa rescriu pagina