[CSS] Drei Divs nebeneinander

[Standard]

Morgen zusammen,

wie kann ich mir mit CSS drei Divs nebeneinander platzieren? Mit float: left und right bekommt man ja nur zwei nebeneinander, kann aber in einen evtl. in der Mitte freigelassenen Platz nichts schreiben...

[Peter0308]

AW: [CSS] Drei Divs nebeneinander

Hi,

mit "float" bekommst du so viele <div> nebeneinander, wie in deinen "Rahmen" passen. Das kann nur einer sein, aber auch zwanzig. Je nach eingestellter Breite.

Peter

[Standard]

AW: [CSS] Drei Divs nebeneinander

Was schereibe ich dann beim mittleren? Links float: left; rechts float: right; und in der mitte?

[sheeba1507]

AW: [CSS] Drei Divs nebeneinander

Hier mal ein Beispiel :

1. Links
float: left;
width: 30%;

2. Rechts
float: right;
width: 30%;

3. Mitte
width: 30%;
clear: both;

Gruß, Mike

[Peter0308]

AW: [CSS] Drei Divs nebeneinander

Hi ,

[OT]
da fehlen mir doch ein paar %
[/OT]

Und bitte erst in dem Element das nach "Mitte" kommt clearen.

Peter

[Ingo]

AW: [CSS] Drei Divs nebeneinander

Hi,

3. Mitte
width: 30%;
clear: both;

dann wäre dieses Element unterhalb der floatenden Boxen.
Abgesehen davon ist es bei einer solchen Konstruktion sinnvoller, hier keine Breite vorzugeben.

Gruß
Ingo

[andre.roesti]

AW: [CSS] Drei Divs nebeneinander

Hallo,

Warum nicht so:

.left {
width: 33.333%
position: absolute;
left: 0;
}

.middle {
width: 33.333%;
position: absolute;
left: 33.333%;
}

.right {
width: 33.333%;
position: absolute;
right: 0;
}

MFG
[ASTERIX]

[eloms]

AW: [CSS] Drei Divs nebeneinander

Hallo

Hier mal eine Anleitung. Hat mir sehr geholfen, auch ohne CSS Erfahrung.


Michael

[Ingo]

AW: [CSS] Drei Divs nebeneinander

Hi,
weil bei absoluter Positionierung der Textfluß nicht wieder hergestellt werden kann, um z.B. einen Footer drunter zu setzen.

Gruß
Ingo

[Standard]

AW: [CSS] Drei Divs nebeneinander

Also kann ichs so machen wie von sheeba beschrieben?

[Peter0308]

AW: [CSS] Drei Divs nebeneinander

Hi,

ja kannst du ... wenn du die Nachfolgenden Bemerkungen über die "clear"-Anweisung beachtest.

Peter

[Standard]

AW: [CSS] Drei Divs nebeneinander

Ich habs jetzt so geschrieben wie aus diesem Beitrag:

div#eins {
background-color: green;
float: left;
width: 33%;
}

div#zwei {
background-color: red;
width: 33%;
clear: both;
}

div#drei {
background-color: blue;
float: right;
width: 33%;
}

(1= links
2= mitte
3= rechts)

Es wird mir aber anders wie gewünscht angezeigt: 1 und 2 sind direkt untereinander und links, 3 ist wieder darunter, aber rechts.

[Peter0308]

AW: [CSS] Drei Divs nebeneinander

Hi,

du hast gleich zwei Fehler gemacht.

1. Die Bemerkungen über die clear-Anweisung hast du doch nicht berücksichtigt.
2. Die Reihenfolge deiner divs ist nicht richtig.

Ich vermute mal, dass du die Float-Anweisung noch nicht richtig kapiert hast. Wenn du einem div eine Float-Anweisung gibst, wird das nachfolgende Element recht/links neben das Floatende div positioniert.

Peter

[Standard]

AW: [CSS] Drei Divs nebeneinander

Heißt das, ich muss sie in der css-Datei in der Reihenfolge 1-3-2 schreiben?

edit:
habs so geändert, jetzt ist der erste links, der dritte ganz rechts und auf gleicher Höhe, aber der zweite ist noch nicht zwischen den anderen beiden, sondern direkt unter dem ersten.

[Ingo]

AW: [CSS] Drei Divs nebeneinander

Hi,
schau Dir mal http://de.selfhtml.org/css/layouts/anzeige/3spaltig.htm an.
Gruß
Ingo