Bla: float:left + float:left + clear:left springt zuweit zurück

Beitrag lesen

Erstes div links, wird rechts von zweitem div umflossen, ok.

Zweites div beinhaltet img, img wird rechts von schrift
umflossen, auch ok.

Der weitere schriftfluß soll unterbrochen werden und unter dem img sich fortsetzen, was ich mittels <br clear:left> zu realiseren versuchte.

Das klappt so nicht: Der text wird unter das erste, ganz links stehende div gedrückt (obwohl er ja eigentlich zusammen mit dem img in ein eigens div "gesperrt" ist), nicht unter das zweite, rechts davon stehende. Der text springt also zuweit zurück in richtung links.

Schalte mal im zweiten <div> einen Rahmen ein (zB style="border:1px solid red"). Du wirst (bzw. solltest, standardkonformer Modus eingeschaltet, ordentlicher Browser) sehen, dass es nicht etwa rechts vom ersten float-<div> beginnt, sondern am linken Fensterrand. Das erste float-<div> überlappt also das zweite <div>, es steht nicht links daneben.
Deshalb springt der Text auch ganz nach links zurück. float wirkt sich nur auf die Zeilen aus, nicht auf das Blockelement.

Weiterhin besagt die Definition von clear, "the top border edge is below the bottom outer edge of *any* left-floating boxes that resulted from elements earlier in the source document." float und clear lassen sich also nicht stapeln, ein clear löscht alle vorigen floats.

Lässt sich das nicht verhindern?

Du könntest dem zweiten <div> einen Außenrand (margin-left) in Breite des ersten float-<div>s geben