nicht angemeldet
Hallo,
ich bin gerade dabei eine neue Seite zu erstellen. Da Tabellen eigentlich nicht zu Layoutzwecken benutzt werden sollen und man stattdessen CSS benutzen soll, dachte ich, ich versuchs doch auch mal. Nun ist ja das dumme, dass man beim Spaltenlayout mit CSS2 keine Möglichkeiten hat, 2 Spalten die gleiche länge zu geben (soll mit CSS3 wohl möglich sein). Ich habe mir mit Javascript (xLibrary) beholfen.
Zunächst einmal wäre es kein Problem, wenn die gleiche Spaltenlänge nur auf Browser mit JavaScript möglich wäre und auf allen anderen die Seite problemlos, aber eben mit ungleichen Spaltenlängen angezeigt würde. Das ist bei dir nicht der Fall, das Layout fällt ohne JavaScript durch deine komplizierten position:absolute-Konstrukte auseinander. Wenn du das alles herauswirfst und ein einfaches float-Layout mit drei divs plus Zusatzdivs für die Hintergrundeffekte baust, sieht die Seite ohne JavaScript auf jeden Fall gut aus. Das Markup wäre auch sinnvoller als das jetzige Gewurschtel mit leeren divs (der jetzige Code ist kein bisschen sinnvoller als Tabellenlayout). Mit JavaScript kannst du dann das div der linken Spalte an die Höhe des Container-divs anpassen (das sind ein paar Zeilen JavaScript, lass lieber irgendwelche fremden aufgeblasenen Bibliotheken weg) und die Spalten wären gleich lang.
Davon abgesehen kannst du mit reichlich Fummelei ein Layout erstellen, was den Effekt »gleich lange Spalten« mit Hintergrundbildern simuliert. Das div der linken Spalte ist dabei nie länger als dessen Inhalt, es sieht aber so aus, als würde die Spalte weitergehen. Für solche Fälle gibt es z.B. die »Sliding Doors«-Technik (http://www.alistapart.com/articles/slidingdoors/). Je nachdem, mit wievielen verschachtelten divs man arbeiten (divs, die dann letztlich nicht die Seite strukturieren und keine »semantische« Bedeutung haben, sondern nur zu Layoutzwecken eingesetzt werden - dasselbe wie Layouttabellen), lässt es sich auch mit den vorhandenen Hintergrundgrafiken lösen. Dazu musst du aber erst einmal die Aufsplittung der Grafiken in kleine Stücke überwinden.
Hier einmal ein Entwurf, wie man es vom Konzept her lösen könnte: http://molily.de/temp/deppclan/
Mathias