Festes Element und darunter scrollbarer Bereich am Seitenende

[Arno Nühm]

Hallo zusammen,

ich versuche gerade folgendes hinzubekommen und komme dabei nicht weiter:

Meine Seite soll aus drei Elementen bestehen, übereinander. Das oberste Element ist eine vertikal scrollbare Liste.
Der zweite Bereich soll fix sein und eine fixe Größe haben. Direkt darunter, bis zum Seitenende soll ein dritter Bereich gehen, der wiederum längeren Inhalt haben kann, also vertikal scrollbar sein muss.
Es soll hierbei nur der dritte Bereich gescrollt werden, nicht der zweite mit!

Das ganze soll mit divs funktionieren, grob gesehen also so:

<div style="overflow:auto;">
     oberer Bereich
</div>

<div style="height:20px;">
     mittlerer Bereich, im Prinzip eine Überschrift für den
     unteren Bereich
</div>

<div style="height:80px; overflow:auto">
     <div> Element des unteren Bereichs </div>
     <div> Element des unteren Bereichs </div>
     <div> Element des unteren Bereichs </div>
</div>

Und natürlich soll es nicht mit festen Pixeln arbeiten, sondern auch noch so aussehen, wenn das Browserfenster kleiner gemacht wird. Dabei soll dann der mittlere und untere Bereich die Größe behalten und der obere soll kleiner werden.

Hoffe, ihr könnt mir helfen. Wenn ich position:fixed benutze (bzw. IE-Workaround), scrollen immer der mittlere und untere Bereich gemeinsam, ich will aber verhindern, dass diese Überschrift dann wegscrollt.

Schönes Wochenende,
Arno