Frage von T1Mde, 96

HTML/CSS - zwei divs nebeneinander?

Hi, ich möchte zwei div Container nebeneinander anzeigen. Dabei soll der linke eine festgelegte Breite von 400px haben und der rechte soll den rechten Teil vollsändig ausfüllen (inklusive margin und padding). Wenn der Browser kleiner wird, soll der rechte auch dünner werden und nicht direkt unter den linken Container rutschen. Kann mir jmd helfen?

Hilfreichste Antwort - ausgezeichnet vom Fragesteller
von greenstar19, 83

Habe eS jetzt:

du musst dem linken div ganz normal float: left zuweisen. Dazu noch höhe und breite (400px).

Dem rechten div folgendes:

  • width: auto;
  • float: auto;
  • height: wasdumöchtest;

LG Nico

Kommentar von T1Mde ,

ok danke hab's jetzt - musste noch display:flex; hinzufügen

Antwort
von threadi, 55

Um das umzusetzen gibt es mehrere Möglichkeiten:

a) float => würde ich aus heutiger Sicht nicht mehr empfehlen da es im Vergleich zu den anderen Möglichkeiten nicht flexibel genug ist.

b) flex-Boxen => siehe: https://css-tricks.com/snippets/css/a-guide-to-flexbox/, hat lediglich den Nachteil, dass man die feste Breite wie von dir gewünscht als Abweichung definieren müsste.

c) die Elemente zu Tabellenzellen machen (Stichwort: display: table / table-cell). Vorteil hierbei ist, dass beide Elemente dann eine einheitliche Höhe haben und eine Steuerung wie von dir gewünscht möglich wäre.

Ich würde für deinen Anwendungsfall Variante c) empfehlen.

Antwort
von greenstar19, 58

Dem Linken Div ein Float: left zuweisen und die Pixelgröße. Dem rechten dann die breite 100% zuweisen.

Ich kann es gerade nicht ausprobieren aber sollte gehen.

Kommentar von T1Mde ,

Dann geht der rechte über den linken und verdeckt ihn.

Kommentar von greenstar19 ,

xxxxx

Keine passende Antwort gefunden?

Fragen Sie die Community

Weitere Fragen mit Antworten