Startseite
Leider ist Spaltensatz in CSS2 nicht vorgesehen, daher ist man gezwungen, zu tricksen.
Der Navi wurde mit einer Breite von 150px links gefloatet und sein Border-Bottom entfernt, Content hat einen ebenso breiten Margin-Left und einen linken Border bekommen und platziert sich somit rechts neben den Navi, vertikal gesehen direkt unter den Header, so als sei der Navi gar nicht vorhanden. Dieser wurde durch das Float aus dem Dokumentenfluß herausgenommen.
Eventuell müssen noch einige Paddings und Borders angepasst werden.
Da Navi nur so hoch ist wie sein Inhalt (also die Liste), bekommt stattdessen die alles umgebende Kiste Wrapper die Hintergrundfarbe des Navis und erzeugt somit die Illusion einer bis nach unten reichenden linken Spalte.
Tipp: Analysieren Sie mit der Web Developer Leiste über "Hervorheben/aktuelles Element hervorheben" die tatsächliche Höhe des Navis.
Merke: Bekommt ein Element keine Hintergrundfarbe zugewiesen, erbt es jene seines Elternelementes.
Sollten Sie im Firefox die Web Developer Toolbar installiert haben, deaktivieren Sie doch jetzt mal über STRG+SHIFT+S die Formatangaben... Die Seite sieht dann wieder so aus wie ganz am Anfang der Übungen. So sieht sie übrigens auch eine Suchmaschine. Rein textbasiert.
Im nächsten Schritt werden wir dann dafür sorgen, dass im Navi der Link der aktuellen Seite optisch hervorgehoben wird.