• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Text setzt sich nicht unterhalb DIVs fort, sondern rechts daneben

WoodWide

Neues Mitglied
Hallo zusammen,

ich habe auf einer Seite im body-Tag folgende Struktur:

Code:

<div style="float: left; width: 30%; background-color: #eeeeee; border: 1px solid black; margin-right: 5px; padding: 5px;">Versandmethode</div>

<div style="float: left; width: 60%; background-color: #eeeeee; border: 1px solid black; margin-bottom: 5px; padding: 5px;">Postzustellung</div>

<div style="clear: float;"></div>

Die Titel stehen in der linken Box, die Einträge in der rechten. So weit so gut.
Das ganze geht über mehrere Reihen, jede Reihe hat immer 2 divs.

Wenn ich jetzt unterhalb des letzten divs weitermachen möchte, erscheint der Text am rechten Rand des Browsers, und nicht darunter, wie es eigentlich sein sollte. Was muss ich da ändern?

Ausserdem hätte ich gerne eine volle Ausnutzung des rechten div-Containers, das klappt aber nicht, weil der nach unten rutscht, sobald ich die Breite auf 70 % setze. Wie könnte ich volle 100 % Seitenbreite nutzen? Der 30 % Container soll links sein und der 70 % Container rechts daneben.

LG!
Christian
 
Werbung:
Bei deinem Quellcode gehe ich davon aus dass du "box-sizing" nicht verwendest.

Dann besteht die Breite einer Box aus width + padding + border + margin.

Die linke Box bei dir also aus width 30% + padding 10px border 2px + margin 5px.

Die rechte Box aus width 70% + padding 10px + border 2px.

Das sind zusammen über die maximalen 100%. Unterschiedliche Einheiten kannst du mittels calc zusammen berechnen.

Und wie Sailor schrieb ist float für dein Vorhaben sachlich falsch, dafür wurde Flexbox erdacht und zum CSS hinzugefügt.
 
Werbung:
Zurück
Oben