css float=left verhält sich als hätte es clear=both

[MrMurphy1]

Hallo

wieso rutscht Block 3 weiter runter, je höher Block 2 wird?

Das ist das ganz normale Verhalten bei float und von den Entwicklern vom HTML / CSS so vorgegeben. Siehe zum Beispiel

http://little-boxes.de/lb1/IV-css-positionierung.html

oder das folgende Video

https://www.youtube.com/watch?v=AhegyX7HkYY

Ich möchte erreichen, dass Block 3 direkt unter Block 1 steht.

Dann solltest du den Quelltext entsprechend ändern und zum Beispiel den Inhalt von Block 1 und Block 3 in ein div schreiben.

Wobei es schlechter Stil ist, Text direkt in Container wie div zu schreiben. Dafür ist in deinem Fall eher da p-Element geeignet, dass gleichzeitig dafür sorgen würde, dass Block1 und Block 3 auch in einem div untereinander stehen würden.

Oder du könntest eine Lösung mit JavaScript suchen, die dann aber auch alle Nachteile von JavaScript enthalten würde.

Hintergrundinfo: die Breite der Blöcke soll nachher in px angegeben sein,

Auch darauf solltest du verzichten. Wenn du die Seite flexibel gestalten willst sind %-Angaben eher geeignet.

Gruss

MrMurphy