Footer am unteren Ende der Seite ausrichten?

[Extremefall]

Hallo,
ich habe ein Problem, dass mein Footer nicht ausgerichtet wird. Der Aufbau meiner Seite:

<div class="wrapper"><div class="header"></div><div class="background"><div class="leftcolumn"></div><div class="rightcolumn"></div></div></div><div class="footer"></div>

Mein CSS Datei für das Layout:

html,body {
height:100%;
}
.leftcolumn {
width: 60%;
}
.rightcolumn {
width: 40%;
}
.tdwidth {
width: 29%;
}
.wrapper {
position:relative;
width:100%;
min-height:100%;
height:auto !important;
height:100%;
margin:0 auto;
}
.footer {
position:relative;
width:100%;
height:80px;   
margin:-80px auto 0;
}
.header {
width: 100%;
height: 80px;
}

Könnt ihr mir weiterhelfen? Wo könnte der Fehler sein? Was mache ich falsche? Gruß und Danke Extremefall

Ps.: Hier ein Bild mit dem Problem:

 

[Marv]

So, hab schon gedacht ich finds nicht aber: Probiers mal indem Du bei der Klasse "backgroundimage" das "height: 450px;" raus nimmst.
Die Klasse hast du in deinem Post beim Code übrigens gar nicht mit aufgelistet, zum Glück hast du das Bild gezeigt :)

 

[Extremefall]

Funktioniert fast, aber noch nicht ganz. Denn bei seiten, wo der Inhalt sehr kurz ist, wird das Bild falsch angezeigt. Deshalb habe ich auch height: 450px verwendet. Weißt du vielleicht, wie ich das Problem lösen könnte?

 

[Marv]

Wahrscheinlich wenn du statt

height:450px;

mal

min-height:450px;

probierst.