Webseiten gestalten mit HTML und CSS
13.4.4 Float drop: zu wenig Platz im Browserfenster
Wenn eine gefloatete Box im Browserfenster nicht genug Platz findet, springt sie automatisch eine Zeile tiefer. Abbildung 13.9 zeigt die drei nach links gefloateten Boxen in einem verkleinerten Browserfenster.
Box 3 sitzt unterhalb der anderen beiden Boxen in der nächsten Zeile. Eigentlich völlig normal, aber beim Layouten per float ist dieses »float drop« genannte Verhalten ein großes Problem.
Abbildung 13.9: Bei Platzmangel rutscht die Box in die nächste Zeile
Stellen Sie sich zum Beispiel ein zweispaltiges Layout mit zwei Boxen vor. In der linken Box befindet sich eine Navigation, in der rechten der Inhalt der Seite. Wenn der Browser der Meinung ist, dass die
berechneten Breiten aus welchem Grund auch immer nicht mehr nebeneinanderpassen, steht der Inhalt plötzlich unterhalb der Navigation. Grande Catastrophe.