Footer immer ganz unten
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
anfang
code
copyright
dank
datei
einsparen
ende
http
impressum
layout
machen
paar
position
problem
sache
tag
text
tip
weglassen
zeile
-
//EDIT:
tag/problem">Problem dank nikic gelöst :)
Danke für alle, die mir mal wieder geholfen haben ;)
-----------------------------------
ho ;)
Ich habe nun eine Frage zum Footer einer Seite.
Und zwar will ich den logischerweise immer ganz unten haben...
Hier mein Code:
CSS Datei:
/* Anfang von Footer */ #f_umrandung { min-height:100%; height:auto !important; height:100%; } #footer { position:absolute; margin-bottom:0; background:#333; height:50px; width:100%; border-top: 2px solid #000; } #f_text { text-align:center; color:#ccc; margin-top: 7px; font-size: 0.9em; } #footerlink a { color:#ccc; line-height:1.5em; } /* Ende von Footer */
HTML Datei:
<div id="f_umrandung"> <div id="footer"> <div id="f_text"> Copyright © by VDF in 2008-2009 <br /> <div id="footerlink"> <a href="#">Impressum</a> </div> </div> </div> </div>
Anfangs wollte ich das einfach nur mit bottom:0; bzw. margin-bottom:0; lösen. Im FF ging das auch noch, allerdings streikt wie immer der IE(7)... (Im 6er IE kann ich es noch nicht testen, wird aber vermute ich einmal noch schlimmer sein :D )
Einfach mal ansehen: http://sincer.lima-city.de/footer/
(Das Problem sollte aufleuchten, wenn man sich die Seite im IE ansieht, und hinunter scrollt. Im vergleich dazu die passende Interpretation vom FF :) )
Kurz gesagt: HILFE! ^^
lg && und danke im voraus
Sincer
PS: Ich habe bereits etwas gelesen, was den Footer erst soweit nach unten setzen soll, dass man ihn gar nicht mehr sehen kann, um ihn dann mit margin-bottom:-50px; (in meinem Fall, da 50px = Höhe des Footer) ans Ende der Seite schön positioniert zu setzten. Aber ich habe das nicht so hinbekommen, wie ich es mir vorgestellt habe :/
Beitrag geändert: 13.12.2008 11:47:31 von sincer -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Die absolute positionierung interpretiert zwar IE richtig aber etwas unschön...
vieleicht solltest du einfach die positionierungsart ändern (man ist das schlecht vormuliert; sry)
probiers einfach mal!
Oder hast du etwas bestimmtes mit dieser Seite vor, dass es umbedingt absolut sein muss?
Gruß
Daniel -
ho ;)
Jop... hatte auch schon daran gedacht, die Positionierung auf relative; zu setzten. Nur hat es leider nicht funktioniert.
Also im FF wie immer schon XD aber im IE halt nicht:
Mein aktueller CSS Code:
/* Anfang von Footer */ #footer { position:relative; background:#333; height:50px; width:100%; border-top: 2px solid #000; } #f_text { text-align:center; color:#ccc; margin-top: 7px; font-size: 0.9em; } #footerlink a { color:#ccc; line-height:1.5em; } /* Ende von Footer */
Diesmal überhaupt kein extra Code für den IE -> IE bekommt, was FF bekommt, nur IE packts halt nicht :D
Oder hast du etwas anderes gemeint?
Aktuelle Version: http://sincer.lima-city.de/footer/
lg & thx
Sincer -
ho ;)
Thx für den Link, aber ich konnte jetzt auf die schnelle auch auf der Seite nichts finden, was mein Problem löst. (Ich will ja keinen Footer, der wie das Menü funktioniert, sondern einfach einen, der ganz unten auf der Seite ist...)
Wenn du allerdings genau so etwas auf der Seite gefunden hast, wäre ich dir für einen Link, der genau zu diesem Beispiel führt sehr dankbar :)
lg
Sincer -
Die etwas extreme Methode die nur ein absolut gestresster und relativ unseriöser Webdesigner macht: enfach positionswerte weglassen. Da der footer<div> ja am nde deines sichtbaren berreiches sein soll müsste er dort auch bei allen Browsern erscheinen...
Vieleicht ein blöder; aber abundzu hilfreicher Tipp
Hoffe die anderen werden mich jetzt nicht zu sehr ausbuhen ;)
Könnt ja mal für und wieder meiner Methode erklären; würde mich sehr interessieren!
Gruß
Daniel -
Jop... soweit war ich auch schon... einfach position:absolute; etc. und bottom:0; usw weglassen...
Sollte ja eig. gehen, weil ich es schon auf deren Websites gesehen habe.
Nur weil der IE mich besonders mag... legt er mal eine Pause von der Normalität ein, und macht es mal so, wie ich es nicht will :(
(Ich wette, wenn ich erreichen wollte, dass diese Leiste irgendwo stünde, bekäme ich sie nicht vom Boden weg h3h3h3)
Code:
#footer { background:#333; height:50px; width:100%; border-top: 2px solid #000; }
Sieht so aus, als hätte ich nichts geändert...
Mein "Footer" befindet sich nun zu 80% verdeckt links oben hinter der Menüleiste :*(
Da war mir die Version, die Quer über den Bildschirm lag lieber XD
Wie immer die aktuelle Version: http://sincer.lima-city.de/footer/
Hat noch jemand Tipps? Hinweise? Anleitungen? Links?
Nehme so gut wie alles, was mein Problem löst :P
(Sagt "nein" zu Drogen!)
lg
Sincer
//EDIT:
Ich fürchte, dass mir dieser Teil einfach die Suppe versalzt:
body { margin:0; padding:0; top:0; left:0; font-size:100.01%; background-image:url(hintergrund.jpg); height:100%; }
Da steht, was für alle Elemente gilt: top:0;
Wie mache ich es, dass mein Footer sagt: "Alles schön und gut, aber für mich gilt das top:0; nicht!" ?
Wie kann ich den top Befehl überschreiben?
Beitrag geändert: 9.12.2008 22:24:04 von sincer -
du musst umbedingt den footer div als letzten div aufscchreiben
sonst funktioniert der etwas komische trick mit weglassen natürlich nicht! -
ho ;)
In etwa so?
Die letzten Zeilen meines HTML Codes:
<div id="footer"> <div id="f_text"> Copyright © by VDF in 2008-2009 <br /> <div id="footerlink"> <a href="#">Impressum</a> </div> </div> </div> </body> </html>
Ist klar... abgesehen von der praktischen Ausführung ist es auch viel übersichtlicher alles so anzuordnen, wie man es später einmal auf der Seite sehen will... es war von Anfang an so ;)
//EDIT:
Ich sehe gerade, dass die Zeile 5 im Code leer ist... da sollte eig. ein < br > Tag stehen... wurde wohl von Lima zu einem Zeilenumbruch verarbeitet... tztzt ^^
Noch einen Tipp?
lg
Sincer
PS: Es MUSS etwas mit dem body { } Dingens zutun haben... Denn den Content "Lorem Ipsum" Habe ich, um es gut zu positionieren um 55px von Top weggedrückt... Sonst hätte man den Anfang davon nicht lesen können, weil es vom Menü verdeckt worden wäre... Mit dem Footer kann ich das allerdings nicht machen, es sei denn, es gäbe eine Möglichkeit, den Footer vom Content wegzudrücken... bzw. in den Content zu setzten... *Idee hab* Ist dann halt Codetechnisch gesehen nicht wirklich hübsch :/
*Mal was ausprobieren muss*
Wer nen anderen Tipp hat, möge ihn mir vorschlagen ;)
Thx
//EDIT:
Hab das mal eben umgesetzt... Im FF gehts wie immer Theoretisch wie Praktisch gut... IE, was für eine Überraschung, nicht :P
Aber interessant sieht es im IE trotzdem aus... vil lasse ich es so XD
http://sincer.lima-city.de/footer/
Spaß, natürlich nicht... aber ich denke, dass man den Ansatz verwerten kann, oder?
gn8 ;)
Beitrag geändert: 9.12.2008 22:54:50 von sincer
Beitrag geändert: 9.12.2008 23:00:22 von sincer -
Ich dachte eigentlich an nch weiter unten als es jetzt ist!
leg doch wirklich einfach den tag vor </body> -
Noch ne schnelle Antwort :P
Der Div Tag mit der id "footer" war der letzte vor dem </body> Tag...
Innerhalb des Footer-Divs waren nur noch zwei Zeilen. Aber der Muttertag "footer" War der Letzte.
Wenn wir irgendwie aneinander vorbei reden, tut es mir leid, bin schon etwas müde...
Ich lade die Seite ja immer hoch, also kannst du den Code nehmen, und nach deinen Vorschlägen umgestalten. Wenns funktioniert wäre ich echt glücklich!
gn8 noch, und danke für die vielen Tipps, die bis jetzt kamen :)
Sincer -
ho ;)
Hat noch jem. einen Vorschlag, wie ich das Problem lösen könnte?
Die aktuelle Version zum Ansehen gibt es wie immer unter http://sincer.lima-city.de/footer/ ...
Mir leuchtet echt nicht ein, warum das im IE nicht funktioniert :(
pls hlp
Sincer -
Ich möchte nochmal sicherstellen:
Willst du einen FIXIERTEN Footer haben, der egal wie man scrollt an der selben stelle bleibt, oder willst du, dass er sich direckt an de ninhalt anschließt? -
ho ;)
Ich will einen, der sich, egal wie lange die Seite ist, einfach darunter hin knotzt :D
Also zweiteres...
(...), dass er sich direckt an den inhalt anschließt?
lg
Sincer
PS: Also KEIN position:fixed; -
aso, ic hdachte nächmlcih du willstn fixierten...das was du willst gibts auf der seite natüliich net :D
Aber ehrlich gesagt weiß ic hnicht recht warums nicht gehen sollte. eigebtlich wenn mans ganz nach unten im quellcode macht, dann erschints auch ganz unten :D
Und: Du solltest im Footer an ein paar divs einsparen ... -
ho ;)
Du siehst ja auf der Seite den Quellcode...
Bzw. wenn du willst, poste ich ihn auch gerne :D
Ich habe den Footer ganz unten hin gesetzt, und naja... es bleibt einfach nicht dort.
Wie meinst du das mit Div's sparen?
<div id="footer"> <div id="f_text"> Copyright © by VDF in 2008-2009 <br /> <div id="footerlink"> <a href="#">Impressum</a> </div> </div> </div>
1. Div "footer": Bereich des Footers...
2. Div "f_text": Der Text im Div
3. Div "footerlink": Der Link im Text
Ich könnte jetzt #3 einsparen, und einfach ein #f_text a: machen... aber der eigene Link Div-Tag dient eig. zur Übersicht... stören sollte der auf keinen Fall...
lg
Sincer -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
