Footer immer ganz unten
Publiziert am
von Christoph Eder
Einen Footer-DIV immer ganz Unten anzeigen lassen ... hört sich einfacher an, als es ist.
#footer {
position: absolute;
bottom: 0px;
}... ist zwar schön und gut, funktioniert allerdings nur, solange der Inhalt nicht länger, als die anzeigbar Höhe ist. Wenn beide Versionen möglich sein sollen, kann man auf folgendes zurückgreifen:
HTML
<div id="wrapper">
<div id="content">content</div>
<div id="footer">footer</div>
</div>CSS
html, body {
height: 100%;
}
#wrapper {
position: relative;
min-height: 100%;
height: auto !important;
height: 100%;
}
#content {
padding-bottom: <HÖHE DES FOOTERS>px;
}
#footer {
position: absolute;
bottom: 0px;
width: 100%;
}Ist euer Inhalt kürzer als die anzeigbare Höhe, befindet sich der Footer am unteren Bildschirmrand, sonst rutscht er mit dem Seiteninhalt nach unten.
Chris
