Komplexes HTML/CSS Layout

Unregistriert

Hallo zusammen!

Ich kämpfe mit einem (für mich) komplexen HTML/CSS Layout und komme irgendwie nicht so recht vom Fleck.
Nachdem ich mir einen Wolf gegoogelt habe, dachte ich, ich probiers mal hier im Forum.

Folgender Aufbau ist das Ziel:
div "a" mit dynamischer Höher (also je nach Inhalt / Firmenlogo etc.)
div "b" mit 100px Höhe (Buttons für diverse Aktionen)
div "c" mit overflow: auto (Fliesstext)
div "d" mit 50px Höhe (sozusagen Statusleiste)
div "e" mit dynamischer Höher (also je nach Inhalt)

Das Ganze soll den gesamten Anzeigebereich des Browsers nutzen ohne scrollen zu müssen.
div a und e sollen immer fest ganz oben bzw. unten stehen.
div c soll sich den Rest der Ausgabehöhe nehmen und dabei ggf. eine Scrollbar bereitstellen.

Hat jemand ne Idee?

Vielen Dank vorab!

Gruß Marc

alxy

Komplex würde ich das noch nicht nennen, 3divs sind ja sozusagen standard:

-Oben (Oberer teil des containers)
-"Haupt/Allgemein" (Mittlerer teil des containers, je nach länge des contents nach y repeatet, scrollbar)
-Unten (Unterer Teil des containers)

Im HTML-code könnte das so aussehen:

HTML

<div id="Haupt/Allgemein">
<div id="oben"> </div>
<!--content -->
<div id="unten"> </div>
</div>

das kann natürlich beliebig durch div-elemente erweitert werden.

CSS sollte es dann so aussehen:

Code

#oben {  
        background:url("Pfadangabe zur Bilddatei(oben)") no-repeat scroll center top #FFFFFF;  
        /* Angaben zu Maßen des Bildes */

    }  

    #Haupt/Allgemein {      
        overflow: hidden;  
        margin: auto 0;  
        background:url("Pfadangabe zur Bilddatei(main)") repeat-y scroll center center #FFFFFF;  
    }  

    #unten {  
        background:url("Pfadangabe zur Bilddatei(unten)") no-repeat scroll center top #FFFFFF;    
    }

Alles anzeigen

Soll der container nur runde ecken oÄ haben, lässt sich das mittlerweile natürlich auch mit css3 coden.
Desweiteren würde ich bei allen bilddateien Breite und höhe mitangeben.

Tags