nicht angemeldet
Mehrere Spalten / position:absolute
Hallo, liebe Gemeinde,
ich habe in den letzten Tagen so viel wichtiges Zeug gelesen, daß ich jetzt vor lauter Bäumen den Wald nicht mehr sehe. Vielleicht könnt Ihr mir ja den Kopf wieder zurechtrücken.
Aufgabe: Ein Layout mit 3 Spalten (zunächst unwichtig, ob liquid und wie breit), wobei in der linken Spalte nur bei Bedarf was steht, abhängig vom Inhalt der mittleren Spalte (rechte Spalte interessiert hier nicht, erhält später die Navigation).
Gemeinhin geht man ja so vor, daß man die mittlere Spalte relativ positioniert, damit man fröhlich was dranhängen kann. Die erste Spalte wird dann absolut positioniert und erst am Schluß gefüllt.
Erster Haken: Das funktioniert nur, wenn die 3 Spalten oben anfangen. Gibt es einen Kopfbereich, dann kann man zwar immer noch die linke Spalte absolut positionieren, aber wehe, der Besucher ändert die Font-Größe, weil seine Augen so schlecht sind, wie meine. Dann fängt die linke Spalte nämlich irgendwo im Kopfbereich an. Soweit richtig?
Zweiter Haken: Selbst wenn man das hinkriegt, funktioniert das nur für den ersten Datenblock der linken Saplte. Benötigt man weiter unten noch einen, kann man den nur relativ positionieren, aber relativ wozu? Beispiel:
+------+------+------+
! L1 ! M1 ! R1 !
+------+------+------+
! ! M2 ! !
+------+------+------+
! ! M3 ! !
+------+------+------+
! L2 ! M4 ! !
+------+------+------+
Wenn die mittlere Spalte geschrieben ist, wie positioniere ich L2?
Wenn die mittlere Spalte nur bis M3 geschrieben ist, kann ich L2 recht einfach positionieren, aber wie krieg ich dann M4 neben L2?
Ehrlich gesagt, kommt mir dieses ziemlich normale Layout so vor, als wenn es (*kopfzwischendieschulterngezogenundganzkleinlautgesagt:*) mit Tabellen (uff!) sehr viel einfacher ginge.
Ich hoffe, Ihr fühlt Euch jetzt nicht zugetextet, aber ich wollte, daß Ihr das Problem richtig versteht: Wie macht man _sowas_ mit CSS-Bordmitteln?
Wäre nett, wenn mir jemand den entscheidenden Tip geben könnte.
Bis denn
Angy
-
Hi Angy,
mein Tempelhüpfer ;)
+------+------+------+
! L1 ! M1 ! R1 !
+------+------+------+
! ! M2 ! !
+------+------+------+
! ! M3 ! !
+------+------+------+
! L2 ! M4 ! !
+------+------+------+Hm, ich kann's hier leider nicht testen, aber so aus der Hüfte würde ich sagen, dass dir 'width', 'float/clear' und 'left' sehr viel helfen können.
http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#width
http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#float
http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#clear
http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#leftEin anderes, aber doch ähnliches Beispiel: http://forum.de.selfhtml.org/archiv/2002/5/12907/#m71424
Bastle damit mal ein bisschen damit und lass' die absolute Positionierung weg - die macht bei unterschiedlichen Textlängen ohnehin nur Ärger.
LG Orlando
-
Hi Angy,
Hi, Orlando,
ich wusste doch, ich kann mich auf Dich verlassen :)
mein Tempelhüpfer ;)
Hä? Oder doch nicht ? :o))
+------+------+------+
! L1 ! M1 ! R1 !
+------+------+------+
! ! M2 ! !
+------+------+------+
! ! M3 ! !
+------+------+------+
! L2 ! M4 ! !
+------+------+------+Hm, ich kann's hier leider nicht testen, aber so aus der Hüfte würde ich sagen, dass dir 'width', 'float/clear' und 'left' sehr viel helfen können.
Hatte ich letzte Woche oder so auch schon. Dann darf M1 nicht länger als L1 sein, weil es sonst unter L1 weitergeht, und M2 und M3 fangen gleich links an.
Oder irgendsowas.
Dank Dir trotzdem. Bis "später" mal.
Angy
-