nicht angemeldet
Hallo, hier ist die Nyasha,
ich hab da mal ne Frage...
Mein Freund und ich rätseln schon länger an einem dreispaltigen Webseitenlayout ohne Tabellen.
(Es geht um das Nachfolgerdesign von www.tekk.tv.)
www.tekk.tv wurde aber noch mit solchen erstellt. Dies zu vermeiden, sind wir nun auf der Suche nach der CSS-Lösung.
Um den Seitenaufbau zu verdeutlichen bitte einmal auf:
www.kerstin-jahn.de/seitenaufbau.jpg schauen. Jeder farbige Kasten dort stellt ein Div-Container dar. Man sieht im Header 2, ansonsten drei nebeneinanderstehende.
Folgendes hatten wir uns überlegt:
Zentriert im Browserfenster befindet sich ein Container, der die komplette Seite quasi enthält. Zuerst oben links HeaderA und rechts daneben HeaderB. Macht man das mit float: left?
Jedenfalls liegt das Problem drunter:
In der Mitte soll ein ca. 500Pixel breiter Contentbereich entstehen, der links und rechts gesäumt ist mit zwei jeweils ca 200Pixel breiten Menüleisten. Jede Menüleiste enthält verschieden große(=lange) Menüs, zb. links oben das Navigationsmenü, gefolgt von einer Members-online-liste ect. und rechts ebenfalls mehrere Menüs zum Navigieren auf der Seite.
Wie man an den farbigen blauen (links) und grünen (rechts) Menüs erkennen kann, gestaltet sich die Länge (oder besser height) der Menüs je nach Inhalt unterschiedlich, weshalb wir schon daran dachten, die Menüs NICHT mit position:absolute auszurichten, weil sich die Menüs evt. überlappen könnten auf anderen HTML Seiten, wenn eins der Menüs drüber mal bisschen länger wird.. Und ein Scrollbalken wollen wir nicht im Menü haben! Die Menüs sollen sich automatisch vergrössern(=nach unten verlängern), wenn der Inhalt zunimmt.
Jetzt dachten wir schon daran, die Menüs links in einen Container zu packen, in dem die Menüs als einzelne Container einfach untereinander aufgereiht sind, dann den Content dazwischen und rechts wieder nen Menü-Container mit den aufgelisteten Menüs drin. Aber auch diese Idee warfen wir übern Haufen, weil wir uns nich vorstellen können, wie wir im Bedarfsfall ganz einfach zwei Menüs dieser beiden Spalten austauschen können, also bildlich gesprochen ein blaues und ein grünes Menü austauschen...
Etwas deutlicher wird das vielleicht bei www.error2k.com/test.html
Die blauen sind die Menüs mit den Inhalten, das gelbe der Content, das schwarze der Seitenbackground (der große Großelterncontainer ; ) Und das ROTE sind die Menüspalten, in denen die Menüs (blau) dann einfach aufgefädelt sind. Wenn man jetzt "Menü links1" mit "Menü rechts 2" austauschen wollte, ginge das dann überhaupt, wenn man das so verschachtelt, OHNE im Html rumschreiben zu müssen? Weil da geht ja dann der Sinn des Auslagerns beim CSS verloren, wenn man tausende HTML Seiten umbasteln müsste, weil man eine " class="menue4" " oder so austauschen und umschreiben müsste....
Puuh, viel Text, ich hoffe ihr versteht uns, was wir wollen. Bildlich ist es schon so dargestellt, wie wir den Seitenaufbau gerne hätten...
Unser Problem besteht quasi nur darin, die Menüs ohne position:absolute oder tabellen nebeneinander zu positionieren. Zumindest denken wir uns, dass wir das mit diesen Methoden nicht gut realisieren können.
Wir bitten um konstruktive Kritiken! : )
Danke schon mal und guts Nächtle,
Nyasha vs. ERRoR2k