Versuch eines 2-Spalten Layouts

[Xardas der Dunkle]

Code:

edit:
overflow: auto; zu #content hinzugefügt. Sonst läuft der Inhalt bei Übergröße unter dem Footer weiter.

Dann kann man es auch gleich anders machen ohne komische CSS-3 Features.

Code (CSS):

#header {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   height: 300px;
}
 
#navi {
   position: absolute;
   top: 300px;
   bottom: 300px;
   left: 0;
   width: 400px;
   overflow: auto;
}
 
#content {
   position: absolute;
   top: 300px;
   bottom: 300px;
   left: 400px;
   right: 0;
   overflow: auto;
}
 
#footer {
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   height: 300px;
}

Allerdings glaube ich das Whiz-zarD nicht unbedingt möchte das der footer immer am unteren Bildschirm Rand steht.
In dem Fall geht es einfach nicht das die DIVs immer gleich hoch sind. Hier hilft nur die navi und den content in ein div zupacken und diesem ein Hintergrundbild zu geben, welches die Hintergrundfarbe eben bis nach unten durchzieht:

Einfachheit halber mal mit inline-css:

HTML-Code:

<div id="content" style="background: ...;">
   <div id="navi" style="float: left; width: 300px;"></div>
   <div id="content_main" style="float: left; width: 500px;"></div>
   <div style="clear: both;"></div>
</div>

[Whiz-zarD]

Allerdings glaube ich das Whiz-zarD nicht unbedingt möchte das der footer immer am unteren Bildschirm Rand steht.

...

Das ist mir eigentlich egal. Wenns leichter ist, den Footer nach unten zu verfrachten, damit die beiden anderen gleich groß ist, soll es mir recht sein.
Mir ist nur wichtig, dass beiden Divs die selbe Größe aufweisen.

In dem Fall geht es einfach nicht das die DIVs immer gleich hoch sind. Hier hilft nur die navi und den content in ein div zupacken und diesem ein Hintergrundbild zu geben, welches die Hintergrundfarbe eben bis nach unten durchzieht:

Einfachheit halber mal mit inline-css:

HTML-Code:

<div id="content" style="background: ...;">
   <div id="navi" style="float: left; width: 300px;"></div>
   <div id="content_main" style="float: left; width: 500px;"></div>
   <div style="clear: both;"></div>
</div>

...

mmh, so könnte es klappen.
Aber geht das wirklich nicht anders? Ich hätte irgendwie schon ganz gerne, dass der Hintergrund in #navi definiert wird und nicht im #content, weil es einfach für mich zur Navi gehört. Aber gut, so kann ich auch erstmal weiterarbeiten.

Danke erstmal