Footer auf Webseiten sind ein großartiger Ort, um Copyright-Informationen, Kontaktlinks und schnelle Navigationshilfen unterzubringen. Besucher sind es gewohnt, am Ende von Seiten nach solchen Dingen zu suchen, also warum ihnen nicht helfen? Ein Problem ist, dass auf Seiten, die vertikal etwas kurz geraten sind, der Footer mitten auf der Seite landen kann, anstatt unten im Browserfenster, wo er hingehört.
Wir haben einen viel aktuelleren Artikel, der moderne Optionen für Sticky Footer beschreibt, schauen Sie ihn sich an!
Sollte es nicht eine Möglichkeit geben, ein Footer-DIV einfach am unteren Rand des Browserfensters zu positionieren, unabhängig von der Größe des Fensters? Ja, das sollte es geben, es gibt keine offensichtliche Lösung und es ist ein Problem, das die CSS-Welt schon zu lange plagt.
Eine Lösung wurde gefunden! Ryan Fait hat eine wunderschön einfache Methode dafür entwickelt (mit gültigem Code!) und die Technik großzügig hier geteilt. Entschuldigung, das ist jetzt offline. Sie funktioniert in allen wichtigen Browsern (IE, FireFox, Safari und Opera) und ist völlig kostenlos nutzbar. Danke Ryan!
Hallo!
Ich bekomme das nicht zum Laufen, wenn der Inhalt mehr als die Seiten- oder Browserhöhe beträgt. Dann setze ich den Footer einfach wie 'üblich' unten hin.
Irgendein Tipp, wie ich das beheben kann?
Das funktioniert, wenn Sie KEINE absolute Positionierung auf Ihrer Seite verwenden.
Gibt es eine Idee, wie man einen Sticky Footer zum Laufen bringt, wenn man absolute Positionierung verwendet?
Ryans Lösung ist ziemlich cool.
Aber sie bricht auf Weisen, die nicht behoben werden können, wenn Sie feste Höhen für Elemente verwenden.
Daher ist sie ziemlich nutzlos, wenn Sie die Höhen von inhaltsführenden Divs festlegen.
Ich habe es ein paar Mal benutzt, aber ich bin vorsichtig damit.
Das funktioniert bei mir nicht, der Footer überdeckt immer den Inhalt, wenn das Browserfenster klein ist.
Das ist großartig, aber nur eine Frage... Kann ich den Footer über dem Inhalt positionieren?
Auf diese Weise ist der Footer immer sichtbar, egal wie lang der Inhalt ist.
Das wäre etwas einfacher, setzen Sie es einfach aufposition: fixed;undbottom: 0;
Oh ja... das wusste ich ;)
Danke Chris!
Probieren Sie diesen hier http://www.cssstickyfooter.com
Er bricht nicht beim Ändern der Fenstergröße und funktioniert mit schwebenden 2-Spalten-Layouts.
Ich habe versucht zu verstehen, was der Unterschied zwischen einem Sticky Footer und einem normalen Footer ist... Es ist so einfach...