Hi.
Das liegt nicht daran, dass Dein Css falsch liegt. Ist eher eine Reihe von Denkfehlern.
1. Wenn Du einen Hintergrund in eine Richtung wiederholst, brauchst Du nur 1px Breite > 11,2 Kb vs. 828 Byte ist schnellere Ladezeit.
2. Wenn Du auf der Seite bei jeder beliebigen Höhe den Footer immer unten und den Header immer oben haben willst, dann musst Du anders vor gehen. Das der "body {background-image: url(bla.jpg) repeat-x;} hat ist ok. Nur sollte der dann nicht auch den Verlauf für den Footer beinhalten, da der sonst ja auf einer vorgegebenen Höhe sitzt > Hintergrundverlauf für den Footer muss in einen speparaten div
3. Wenn Dein #wrapper eine fixe Höhe hat, dann verhält sich das wie mit dem Hintergrund. Deswegen pickt Dein Footer nie ganz unten, weil der div den unteren Seitenrand gar nicht erst erreicht > #wrapper {height: auto;}
4. Dein Footer-div soll die komplette Seitenbreite einnehmen > #footer-back {background-image: url(back.jpg) repeat-x; width: 100%; position: absolute; bottom: 0; height: XYpx; z-index: 10;}
5. #wrapper Hintergrundfarbe: Raus damit
6. den untersten Footer-div im #wrapper auch löschen.
Wenn Du alle 5 Schritte umsetzt, sollte es passen. Kann sein, dass es noch eleganter geht, wenn du den footer-div als container für einen weiteren div nimmst: div#footer-streifen-blau {background-color: blue; height: 50%; position: absolute; top: 0px;} ... dann sparst Du Dir die Ladezeit für die Grafik im Footer. Bei 4. dann das background-image weg und eventuell statt background-color: blue eine hex-farbe aus Deinem Hintergrund-Bild #xxxxxx
Gutes Gelingen.
P.s. Wenn Du genau schaust, dann wiederholt sich Deine Hintergrund-Textur nicht wirklich richtig. Falls Du auch eine andere für den Wasserzeichen-Effekt nehmen willst, such nach "seamless texture".
