[CSS] Aus 2 Spalten 3 machen

[Gremlin]

Hab ein Problem mit einem Layout, und zwar wollte ich aus einem 2 Spalten Design 3 Spalten machen aber habs damit irgendwie zerhauen.

Vorher:
http://ross-media.de/demo/design/index.html

Aktuell:
http://ross-media.de/demo/design/index_neu.html

Wunschdesign:
http://www.vms1.de/thumbs/wunschdesignoxb.jpg (http://www.vms1.de/?img=wunschdesignoxb.jpg)

Also was ich eigentlich möchte, das rechts noch so eine Spalte kommt wie sie links auch ist. Und der Content dafür dann halt linksbündig.

Hat jemand einen Tipp? Hab schon verschiedene Sachen nun probiert, einmal war der Banner links, einmal unterhalb vom Content, einmal der linke unterhalb und der rechte ganz oben .

[jpwfour]

Wenn ein links floatendes Element in die linke obere Ecke seines Elternelements platziert wird und ein zweites left-Float direkt auf das erste folgt, dann wird das zweite in der rechten oberen Ecke platziert und solange nach links verschoben, bis es rechts am ersten anliegt. :der:


Vorsicht! Passen Sie auf Floats auf, die nicht alle dieselbe Höhe haben. Wenn ein Float in der zweiten Zeile nach oben rutscht, um dann seitlich in "seine Richtung" verschoben zu werden, bleibt es am ersten höheren Float "hängen", dem es begegnet. :biggrin1:

http://www.css-technik.de/css-examples/219_9/

Ich hau meistens erst mal überall ein border:1px solid black rum, damit man genau sieht, welches Element wo wie Platz einnimmt.

Ansonsten hilft dir vielleicht die Intensivstation weiter:
http://www.intensivstation.ch/templates/
Glaube das hier ist so, wie du das willst (etwa):
http://www.intensivstation.ch/files/templates/3/intensivstation-template-3-07.html

[Gremlin]

Danke dir für die Links.
Mittlerweile hatte mir nun jedoch auch schon jemand im Klamm-Forum geholfen, seine Lösung war:


Ordne im HTML-Quelltext die Spalten richtig an (ColumnB - ColumnA - ColumnC) und gib in CSS ColumnB und ColumnA "float:left;" und ColumnC "float:right;".

Dann brauchst du nurnoch die Maße und Abstände anpassen http://img4.klamm.de/forum/smilies/icon_smile.gif

Hat perfekt geklappt :thumb:

[Sebmaster]

:biggrin1:
Das Problem hatte ich vor kurzem auch, gelöst hatte ich es auch vor kurzem. Zum Schreiben war ich jetzt zu faul:redface:

[Freak4ever]

*schmol* einmal wenn ich helfen kann sind andere schneller :D
naja das nächste mal =)

lg

[Lokutos]

@ gremmlin wozu brauchst du eigentlich immer mehrere themen :der:

http://www.klamm.de/forum/showthread.php?t=271806


Is ja fast sowas wie externes Doppelposting :suspicious::biggrin1::biggrin1:

PS:
Ich hab mir an dem auch schon die hare ausgebissen.
dein weiteres problehm wird sein wenn du drunter was über alle divs machen willst.

dazu schlag ich dir dan schon mal das vor:


css:

clear:left;


MFG Lokutos

[Gremlin]

<br style="clear:both;">

Müsste das doch auch erledigen, wenn ich darunter was machen will, oder? ^^

[Lokutos]

<br style="clear:both;">

Müsste das doch auch erledigen, wenn ich darunter was machen will, oder? ^^


Jop muss einfach n clear effeckt rein ob both reicht weis ich grad nicht aber musste gegen 50% haste gg

[Gremlin]

Okay *g* CSS ist noch was, was ich unbedingt mal lernen sollte *g* das designen und umsetzen liegt mir leider gar nicht :lol: