Wie könnte ich das Lyout umsetzten?

[jUnit]

Abend,

alle sagen ja, dass Tabellen out sind und Frames auch. Jetzt frage ich mich aber, wie könnte man folgendes Design umsetzten.

Es geht vor allem und die Struktur. Es sollen keine Grafiken sein usw. Ich möchte nur oben ein Header haben und Links eben die Navigation. Soweit so gut. Das wurde ich noch hin bekommen ABER: Der Header und auch die Linke Navigation sollen immer auf dem gleichen Platz bleiben, sprich, wenn man Rechts Text hat, soll der Header und die Navigation Links NICHT verschwinden.

Da man ja mit Frames nicht arbeiten soll, frage ich mich nun, wie könnte man das darstellen?

Hier mal ein Beispiel wie ich das meine.

Gruß,
jUnit

[zippex]

Hallo!
Stimmt, Frames und Tabellen (für Layoutzwecke) sind wirklich out. Für Einsteiger sind vielleicht die 40 Beispiele recht praktisch, die es auf http://blog.html.it/layoutgala/ zum Download gibt. Einfach mal eines herunterladen, anschauen und nachvollziehen... Du wirst schnell sehen, wie du dein Layout mit dem Element div und mit CSS umsetzen kannst.
Viele Grüße
zippex

[jUnit]

Hallo zippex,

danle für den Link nur leider ist da kein Beispiel dabei wie ich das brauch, da geht oben der Header auch immer mit und das ist gerade NICHT das was ich brauch, er soll immer stehen bleiben.

Gruß,
jUnit

[zippex]

der Header soll immer stehen bleiben.

Da fixe Elemente mit dem IE etwas problematisch sind
(http://de.selfhtml.org/css/layouts/fixbereiche.htm)
müsste der Code unten dem entsprechen, was du haben willst (hab es nicht angeschaut). Das ist allerdings kein schöner Code, außerdem müsste das Inhalt-Div per Javascript auf die aktuelle Fenstergröße angepasst werden (was auch nicht schön ist).
Aber vielleicht ist das ein Anfang auf dem du aufbauen kannst. Musst allerdings auch ein bisschen Zeit damit verbringen, dich einlesen und ausprobieren (z.B. hier: http://de.selfhtml.org/css/layouts/mehrspaltige.htm).
Viele Grüße
zippex

<div style="position:absolute; top:0px; left:0px; height:150px; width:100%; background:#AAA; z-index:1;">
oben
</div>

<div style="position:absolute; top:0px; left:0px; width:150px; height:100%; background:#A50;">
<div style="padding-top:150px;">
menu
</div>
</div>

<div style="position:absolute; top:150px; left:150px; width:800px; height:400px; overflow:scroll;">
inhalt
</div>

[Ulrich]

Moin,

der Header soll immer stehen bleiben.

Suche doch einfach bei SelfHTML mal nach den Begriffen "fixiert", "Bereich", "Header" oder "Footer". Ich bin mir sicher Du findest dann etwas, wie das was Du brauchst.

mfG
Ulrich