Tutorials von Thomas Frei-Herrmann

Footer-Beispiel

mit relativer Position

<style type="text/css">
html {overflow-y: scroll; overflow-x: hidden}
#footer {
   position:relative;
   bottom:0px; left:0px; right:0px;
   background-image: url(../assets/images/Background.gif);
   background-repeat: repeat-x;
   padding-top:0px;
   padding-bottom:110px;
}
</style>

Hier habe ich die Breite der Seite auf 5000 Pixel gestellt, denn eine relative Position ist relativ zur Breite des Objektes, das als DIV-Container dient (hier ist es ein extra “Layout-Bereich”).

Daher habe ich dann der HTML der Seite ein “overflow-x: hidden” gegeben, damit keine waagerechte Scrollbar entsteht.