Homepage selbermachen 7.851 Themen, 35.615 Beiträge

Verfolgung starten Optionen

Drei-Spalten-Layout erstellen

Special-J / 6 Antworten / Flachansicht Nickles

Hallo allesamt,

ich bin schon lange dabei mir ein benutzerdefiniertes XHTML/CSS-Layout mit einem Header, Footer und dazwischen 3 Inhaltsspalten zu erstellen, wobei die Spalte in der Mitte flexibel in der Breite sein sollte.

Mein Grundgerüst habe ich mithilfe von Yaml (http://builder.yaml.de/##drop12) erstellt, aber irgendwie will es nicht klappen.
D.h. dass mein Layout nicht konstant in der Höhe bleibt, wenn zB eine der 3 Spalten länger ist als die anderen beiden, ziehen sich diese nicht mit und bleiben so lang, wie es der Inhalt es zulässt.

Habt ihr viellciht eine Idee oder einige CSS-Tipps?
Wäre dankbar dafür :)

bei Antwort benachrichtigen
http://www.css4you.de/wslayout1/ex0010.html HTH, Z. Zaphod
Sorry, aber das hilft mir leider nicht weiter. Mein Layout habe ich ... Special-J
Das kannst Du umgehen, indem Du die 3 Spalten in einen gemeinsamen Container ... xafford
Die 3 Spalten befinden sich bei mir auch in einem gemeinsamen Container, der ... Special-J
xafford Special-J „Die 3 Spalten befinden sich bei mir auch in einem gemeinsamen Container, der...“
Optionen

Hmmm, wann hast Du denn das Tag "</page>" erfunden? ;O)...

Du musst aufpassen, dass Du nicht ein Webdesigner-Vergehen (Tabellen-Layouts) gegen ein anderes Tauscht (DIV-Soup).

Bevor wir aneinander vorbei reden sollten hier mal was ich verstanden habe wie dein Layout aussehen soll:

Du willst eine zentrierte Darstellung deiner Seite im Browser mit einer variablen Breite (also keine feste Inhaltsbreite, sondern abhängig von der Größe des Browserfensters).

Du willst oben einen Seitenkopf mit voller Breite und variabler Höhe.

Du willst unten einen Seitenfuß mit voller Breite und variabler Höhe.

Du willst, dass der Inhalt die linke und rechte Spalte nicht umfließt, sondern dass alle Spalten mit Hintergrund über die komplette Höhe dargestellt werden.

Falls das alles so weit zutrifft hätte ich da auf die Schnelle nur eine Lösung für. Schau Dir mal das Beispiel unter folgender Adresse an:

www.xafford.de/column.html

Bis auf den renitenten IE6 sieht es unter allen Browsern so aus, wie ich meine dass Du es planst. Allerdings ist mir auf die Schnelle noch keine passende Lösung für den IE6 eingefallen.

Pauschalurteile sind immer falsch!!!
bei Antwort benachrichtigen
Ok, damit wir am Ball bleiben, hier erstmal ein Screenshot des Prototyps ... Special-J