Sticky Footer nur mit CSS erstellen

Gr33nbl00d CSS

Um einen Sticky Footer in WordPress oder auch überall anders zu erstellen muss man folgenden CSS-Code zu seiner Seite hinzufügen:

body{
     margin-bottom: 2.5%;
} 

footer{
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    text-align: center;
}

Der Fußbereich muss dazu in <footer></footer> HTML-Tags. Und der CSS-Code muss entweder in deine style.css oder in <style></style> Tags. Wie du deine style.css Datei anlegen kannst erfährst du hier.

Ohne CSS-Code:

Ohne Sticky Footer Code

Mit CSS-Code:

Mit Sticky Footer Code

Durch den CSS-Code wird der Fußbereich unten an die Seite „geklebt“. Auch wenn man eine Seite hat auf welcher der Inhalt größer als eine Bildschirmseite ist wird der Fußbereich immer ganz unten am Bildschirmrand angezeigt.

Seite mit viel Inhalt ohne CSS-Code:

Seite mit viel Inhalt ohne Sticky Footer Code

Seite mit viel Inhalt mit CSS-Code:

Seite mit viel Inhalt mit Sticky Footer Code

Ich hoffe, dass ich dir helfen konnte. Weiterhin viel Spaß beim Coden 😉