3 Kolonnen unterschiedlicher Farbe

[MonsieurBon]

Hallo zusammen

Ich möchte folgendes machen:

Einen Header, darunter drei Kolonnen (Navigation, Content, Sidebar). Alles mit DIV natürlich. Der Header und die Navigation sollen die Hintergrundfarbe schwarz haben, Content soll weiss sein und die Sidebar soll grau hinterlegt sein.

Soweit kein Problem.

Aber wie schaffe ich es, dass die drei Kolonnen immer dieselbe Höhe haben, ohne diese aber fest im CSS festzulegen? Der Content soll unterschiedliche Höhen haben können und trotzdem sollen die Navigation und Sidebar immer gleich lang sein.

Kann mir da jemand helfen?

[EKKi]

Mahlzeit,

[...] drei Kolonnen [...]

Was verstehst Du in diesem Zusammenhang unter "Kolonnen"?

MfG,
EKKi

[MonsieurBon]

sowas in der Art:

-----------
|  Header   |
 -----------
|1 | 2   |3 |
|  |     |  |
|  |     |  |
|  |     |  |

1, 2 und 3 sind die drei Kolonnen. 1 soll schwarz sein, wie der Header, 2 weiss und 3 grau.

[Steel]

Hallo,

Das nennt man Spalten. Du suchst ein ganz gewoehnliches 3 spaltiges Layout. Allerdings ist das nicht so einfach zu machen, da man mit CSS einem element nicht die groesse des Nachbarelements zuweisen kann. Du musst also tricksen. Mit Faux collumns oder einem aehnlichen Konzept sollte das machbar sein.

Grundsaetzliches findest Du hier:
http://de.selfhtml.org/css/layouts/mehrspaltige.htm
und hier noch mehr CSS Templates:
http://www.intensivstation.ch/templates/

Der Witz dabei ist, ein Design zu entwickeln bei dem alles nur so aussieht als ob. Wenn Du einem umgebendem Containerdiv eine Hintergrundfarbe gibst und darin 3 Spalten definiertst, dann haben die linke und rechte Spalte z.B. immer diese Hintergrundfarbe, solange der Container fuer den Inhalt laenger ist, als die aeusseren Spalten.

[MonsieurBon]

Ok, Spalten! :-)

Das mit den drei Spalten wäre auch nicht so ein Problem, wenn es nicht drei unterschiedliche Farben sein müssten. So schlecht sieht es aber gar nicht aus. Jedenfalls im Firefox! ^^

http://www.re-raise.ch/redesign

[Ingo Turski]

Hi,

Das mit den drei Spalten wäre auch nicht so ein Problem, wenn es nicht drei unterschiedliche Farben sein müssten.

Und warum gibst Du dem content-div nicht einfach eine passend breite graue Hintergrundgrafik, rechts positioniert und repeat-x?

freundliche Grüße
Ingo

[Inita]

Hoi,

shau das beispiel an:

http://inix.in.funpic.de/3divs.html

LG,
Inita