DIV unten ausrichten (Prob beim Scrollen) im Forum Homepage Hosting

Ich habe da ein ähnliches Problem. Erstmal hier die Struktur meines Index:

1: 
2: 
3: 
4: 
5: 
6: 
7: 
8: 
9:


	{%HEADER%}
	{%NAVIGATION%}
	{%MESSAGES%}
	{%CONTENT%}
	{%FOOTER%}

Alle DIVs sollen untereinander stehen, wobei der Footer immer - wie der Name sagt - ganz unten sein soll, Auch wenn das Content-DIV-Element nicht die ganze Höhe der Seite braucht. Das geht ja eigentlich mit

1:	position: absolute; bottom: 0;

Ich möchte jedoch, dass wenn gescrollt werden muss, der Footer am unteren Ende zu finden ist und nicht - wie mit "fixed" - "mitscrollt". Wenn ich jetzt weiterhin die Definition für das Element stehen lasse, bleibt der Footer einfach stehen und der Content geht unten drunter durch...

Hier mal meine CSS-Definitionen für die Elemente und den Body (sind jetzt ein wenig versaut, weil ich auf der Suche nach einer Lösung dran rumgefummelt habe):

1: 
2: 
3: 
4: 
5: 
6: 
7: 
8: 
9: 
10: 
11: 
12: 
13: 
14: 
15: 
16: 
17: 
18: 
19: 
20: 
21: 
22: 
23: 
24: 
25: 
26: 
27: 
28: 
29: 
30: 
31: 
32: 
33: 
34: 
35: 
36: 
37: 
38: 
39: 
40: 
41: 
42: 
43: 
44: 
45: 
46: 
47: 
48: 
49: 
50: 
51: 
52: 
53: 
54: 
55: 
56: 
57: 
58: 
59: 
60: 
61: 
62: 
63: 
64: 
65: 
66: 
67: 
68: 
69: 
70: 
71: 
72: 
73: 
74: 
75: 
76: 
77: 
78: 
79: 
80: 
81: 
82: 
83: 
84: 
85: 
86:

BODY
{
	font: 12px sans-serif;
	color: #444;
	background-image:url('../img/bg.gif');
	background-repeat:repeat;
	margin: 0;
}

HTML, BODY {
	height: 100%;
}

.container
{
	position: relative;
	background-image:url('../img/bg_mid.gif');
	background-repeat: repeat-y;
	background-position: center;
	width: 660px;
	max-width: 660px;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto;
}

DIV#footer
{
	position: absolute;
	border-top: 3px solid #CCC;
	background-color: #EEE;
	padding: 5px 0;
	font-size: 10px;
	text-align: center;
	color: #555;
	bottom: 0;
	width: 640px;
	max-width: 640px;
	margin: 0 10px; /* Abstand vom Container */
}

DIV#header
{
	text-align: right;
	color: #BBB;
	font: 10px sans-serif;
	padding-right: 5px;
	background-image: url('../img/bt_logo.gif');
	background-repeat: no-repeat;
	background-position: bottom left;
	min-height: 60px;
	height: 60px !important;
	margin: 0 10px; /* Abstand vom Container */
}

DIV#nav
{
	top: 50px;
	background-color: #F6F6F6;
	padding: 3px 10px;
	border-top: 3px solid #DEDEDE;
	color: #333;
	height: 20px !important;
	min-height: 20px;
	margin: 0 10px; /* Abstand vom Container */
}

DIV#content
{
	border-top: 1px solid #DDDDDD;
	color: #676767;
	padding: 5px 15px;
	margin: 0 10px; /* Abstand vom Container */
}

DIV#messages
{
	font-size: 10px;
	color: #F60;
	font-style: italic;
	padding-left: 5px;
	margin: 0 10px; /* Abstand vom Container */
}

Ja ich weiß, Schriftgrößen sollten eigentlich nicht fix in px gesetzt werden. Ich wollte das später ändern ;)

Ich hoffe ihr könnt mir da helfen.
Beste Grüße,

tux86.