3 divs untereinander

Hallo zusammen,

ich soll ein Layout erstellen, das aus 3 Bereichen besteht: Oben, Mitte und Unten.

Der gesamte Bereich soll nicht größer als das Fenster sein.
Der Bereich Oben hat eine feste Höhe.
Die anderen beiden Divs sind in Ihrer Höhe flexibel, wobei der Bereich Unten eine höhere Priorität hat und immer komplett angezeigt werden soll ohne zu scrollen.
Der Bereich Mitte soll sich den übrigen Bereich nehmen und wenn mehr Platz benötigt wird, soll dieser Bereich scrollen.

<div id="oben" class="oben"></div>
<div id="mitte" class="mitte"></div>
<div id="unten" class="unten"></div>

Vielleicht habe ich nur ein Brett vorm Kopf, aber ist es möglich dies mittels CSS zu realisieren?

Zitat von keycee

ist es möglich dies mittels CSS zu realisieren?

Ja. Und damit wäre deine Frage korrekt beantwortet.

http://www.css4you.de/overflow.html

Ja, die Frage an sich wäre damit korrekt beantwortet.
Aber mein Problem besteht leider noch und extra einen neuen Thread zu öffnen um eine überarbeitete Frage zum gleichen Thema zu stellen, finde ich nicht so passend.

Also mir ist schon klar, dass man mit overflow sagt, wie sich ein div zu verhalten hat bei übergroßen Inhalt.

Mein erster Impulse war dies (kleiner Auszug):
body
{
height: 100%;
width: 800px;
margin-top: 0pt;
margin-right: auto;
margin-bottom: 0pt;
margin-left: auto;
text-align: center;
font-family: Calibri, Verdana, Tahoma, Arial, Helvetica, sans-serif;
font-size: 11px;
background-color: #FFFFFF;
}
.oben
{
position: absolute;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
width: 800px;
height: 20px;
padding-top: 3px;
background-color: #D0DFEA;
border: 1px solid #BACBCB;
font-size: 11px;
line-height: 11px;
text-align: center;
}
.mitte
{
position: absolute;
top: 35px;
right: 0px;
bottom: 240px;
left: 0px;
width: 800px;
font-size: 11px;
line-height: 11px;
text-align: left;
overflow: auto;
}
.unten
{
position: absolute;
top: auto;
right: 0px;
bottom: 0px;
left: 0px;
width: 800px;
height: auto;
background-color: white;
font-size: 11px;
line-height: 11px;
text-align: left;
}

Mit dem Inhalt der Beispielseite passt es, aber ich weiß das der untere Bereich bei 1-2 Seiten viel kleiner ist,
also dürfte da die Mitte größer werden, aber "bottom: 240px;" lässt dies nicht zu.
Auch gibt es eine Seite, wo der untere Bereich viel größer ist und da ist "bottom: 240px;" wieder im Weg...

Gibt es eine Lösung für mein Problem?