[CSS] Drei gleich lange Spalten

Zweipunktnull

Commander
Dabei seit
Dez. 2004
Beiträge
2.546
Hallo!

so. ich - überzeugter css benutzer - bin kurz davor wieder ne tabelle zu benutzen...

es geht um ein dreispaltiges layout. alle spalten sollen gleich lang sein.
das problem: navi kann zwar feste größe haben, aber zwei spalten sind dynamisch...

--> ich habe um die drei divs noch ein größeres div drumgemacht mit einem background-image. so konnt ich 3 "unechte spalten" erzeugen. naja, okay, das ist ja schön und gut, allerdings funktioniert diese methode nur, wenn zwei spalten statisch sind und eine dynamisch.
bei dieser lösung muss man immer wissen, welche spalte die längste sein wird.
das kann ich aber nicht. wie gesagt, eine spalte ist die navi. in den beiden anderen sind unterschiedliche inhalt - mal kann die eine länger sein, mal die andere...

aber bei der oben genannten methode mit unechten spalten muss man immer wissen, welche die längere sein wird.

Gibts denn nichts in CSS mit dem man sowas machen kann?
Mit ner Tabelle wäre es das einfachste der welt...
und mit css macht es so unendlich probleme.

ich hoffe ihr habt mein problem verstanden :)
 
Ich interpretier jetzt Länge einfach mal als Höhe. Also, du nimmst einen Haupt Div, mit 100% Breite. Dem kannst du dann auch deinen Hintergrund geben. Da rein kannst du deine 3 Divs tun. Die Höhe der Variablen Divs und des haupt Div gibst du gar nicht erst an, ergibt sich dann durch den Inhalt. Den Rest gibst du mit 100% an, somit isr er immer so hoch wie der Rest.

MfG Blitzcoder
 
ja so gehts eben gerade nicht...
mit dieser methode (faux columns) muss man die längste spalte wissen. wie ich oben geschrieben habe. denn die höhe des haupt divs richtet nich nach der höhe des divs, welches als letztes im quellcode steht.
bsp: steht das div in der mitte als letztes im quellcode und die höhe im rechten div wird größer als die des divs in der mitte, so wächst das haupt div nicht mit..

ich brauch was genialeres als faux columns ;)
 
Vielelicht hilf dir AnyColumnLongest weiter? Ich hab's mir nicht genauer angeschaut, scheint aber ein paar Beispiele zu haben die genau dein Problem lösen.
 
Werbebanner
Zurück
Top