4 (vier) spaltiges Layout

[daniel_]

Hallo Zusammen..

ich versuche mich gerade an einen vierspaltigen Layout.
Hauptproblem ist, dass die Höhe aller Spalten gleich lang bleiben soll.
Alle Breiten sind klar definiert. Der Content mit dem flexiblen Inhalt (feste breite, flexibler Inhalt) steht ganz rechts.
Beim Scrollen soll die gesamte Seite verschoben werden. Den drei linken Spalten eine feste Breite zu geben und der Rechten ein overflow:auto; ist nicht das Ziel.
Habe mir viele Beispiele angeschaut. Doch der Fakt, dass es keine zwei oder drei, sondern vier(!) Spalten sind, scheint echt heftig zu sein.

Über Tipps von Euch freue ich mich sehr!

Vielen Dank und Beste Grüße,
Daniel

[Steel]

Hi!

Ne kleine Frage haette ich da:
Wo is denn der Unterschied ob 3, 4 oder n Spalten? Mir will da spontan keiner einfallen.

[suit]

Wo is denn der Unterschied ob 3, 4 oder n Spalten? Mir will da spontan keiner einfallen.

mir eigentlich auch nicht - faux columns funktionieren auch mit 522 spalten (fester breite) problemlos

[daniel_]

Wo is denn der Unterschied ob 3, 4 oder n Spalten? Mir will da spontan keiner einfallen.

mir eigentlich auch nicht - faux columns funktionieren auch mit 522 spalten (fester breite) problemlos

Hallo Zusammen.

Nur die Anordnung ist kein Problem, ja.
Vielleicht hat ein Detail gefehlt: jede Spalte soll einen eigenen -durchgehende- Hintergrund haben. Also z.B. v.l.n.r. Gelb, Orange, Rot, Magenta.
In welchen div muss denn jetzt die Hintergrundfarbe für die dritte Spalte (Rot) definiert werden? Ich verliere da leider den Überblick.

PS: als <table> währe es extrem(!) einfach. Aber das ist je nicht so "professionell".

Besten Dank und Grüße,
Daniel

[suit]

Vielleicht hat ein Detail gefehlt: jede Spalte soll einen eigenen -durchgehende- Hintergrund haben. Also z.B. v.l.n.r. Gelb, Orange, Rot, Magenta.

spielt keine rolle auch wenns ein zebrastreifenmuster oder ein regenbogen ist - es muss nur als wiederholbarer hintergrund von oben nach unten realisierbar sein

In welchen div muss denn jetzt die Hintergrundfarbe für die dritte Spalte (Rot) definiert werden? Ich verliere da leider den Überblick.

in keinen der vier sondern in das elternelement

[daniel_]

spielt keine rolle auch wenns ein zebrastreifenmuster oder ein regenbogen ist - es muss nur als wiederholbarer hintergrund von oben nach unten realisierbar sein

Ja genau das ist es ja! Das ist das Problem:
Die Hintergründe sollen nicht einfarbig sein, sondern einen vertikalen Verläufe haben.

Ich versuche nun schon länger hin zu bekommen. Faux scheint der falsche Weg zu sein. Ein Beispiel habe ich gefunden:
http://www.code-sucks.com/css%20layouts/faux-css-layouts/4-column-css-layouts/faux-39-4-col/
Dort ist auch ein vertikal skalierbares .gif-Bild als Hintergrund.

Jedes der vier Spalten soll aber ein eigenes verlaufenes Hintergrund besitzen.

Sind "Faux Columns" die einzige Technik um gleichlange DIVs nebeneinander zu plazieren?

Besten Dank für den Response..
..Daniel

[Jonathan]

Hallo daniel_,

Sind "Faux Columns" die einzige Technik um gleichlange DIVs nebeneinander zu plazieren?

Es gibt keine (sinnvoll nutzbare) technik um 4 gleichlange Elemente mit variablem Inhalt nebeneinander zu plazieren. Auch bei Faux Columns sieht es nur so aus.

Die Einzige Problemlösung, die mir einfallen würde, wäre eben, das Hintergrundbild so hoch zu machen, dass es garnicht wiederholt werden braucht. Oder du verschalchtelst eben 2 "Elternelemente", so, dass das äußere einen wiederholbaren Hintergrund kriegt und das innere eben den verlauf, der nicht wiederholt wird.

Das Problem ist: Das geht nicht sinnvoll, wenn auch noch die Spaltenbreiten variabel sind.

Jonathan

[suit]

Ja genau das ist es ja! Das ist das Problem:
Die Hintergründe sollen nicht einfarbig sein, sondern einen vertikalen Verläufe haben.

das kommt auf die art des vertikalen verlaufs an, wie jonathan schon sagt gibts aber dennoch möglichkeiten

es besteht zb die möglichkeit, einen sich vertikal widerholende grafik einzufügen ins elternelement (parent) der vertikale verlauf wird dann jeweils in in die kinder eingefügt (a, b, c und d)

<div id="parent">  
  <div id="a"></div>  
  <div id="b"></div>  
  <div id="c"></div>  
  <div id="d"></div>  
</div>

wenns nicht hinhaut:
kannst du ggf mal einen screenshot von deinem design posten um sich das anzusehen?

[Beat]

ich versuche mich gerade an einen vierspaltigen Layout.
Hauptproblem ist, dass die Höhe aller Spalten gleich lang bleiben soll.
Alle Breiten sind klar definiert.

Du scheinst dich da ja ziemlich auf bestimmte minimal erforderliche Viewportgrössen festgelegt zu haben.

Ich würde nur eine Hauptspalte und eine Sidebar machen, die aus drei im besten Fall nebeneinander, sonst untereinander liegenden Spalten besteht.

mfg Beat