Christoph Hörl erklärt die Lösung zu einem Problem, dass ich auch immer wieder hatte: Rechts bzw. links angeordnete Bilder, um die Text fliesst, überlappen auf folgende Textbereiche oder andere Elemente, wenn sie höher als der umfließende Text sind. Ein Beispiel:
Das ganze kann man mit CSS so korrigieren, dass die gewünschte Darstellung raus kommt:
Im Beispiel fällt das nicht so extrem auf, weil ich das Bild bewusst rechts plaziert habe, wo es nur über die folgenden Überschriften ragt und so keinen großen Schaden anrichten kann.
Die Lösung dieses Bilderproblems: Man umschließt den kompletten Code mit <div style="overflow:auto">...</div>. Danke Christoph!
Links aus dem dargestellten Beispiel:
Bionade
Kampf der Ampelmännchen
Und damit bei mehreren Absätzen die Float Elemente sich nicht gegenseitig umfloaten kann manchmal ein clear: both; helfen.