nicht angemeldet
Float tötet Border
Hiho,
hab mal wieder einen Punkt gefunden, warum ich "float" absolut nicht leiden kann. Folgendes Ziel: Ich will eine Box mit festdefinierter Breite und links und rechts einen Rand. In dieser Box wiederum sollen sich zwei weitere Boxen befinden, die nebeneinander floaten. Eigentlich kein großes Problem - dachte ich. Nun muss ich feststellen, dass - sobald ich die inneren Boxen nach links floaten lasse, mir das den Rand zerstört (im FF - warum auch immer). Irgendwelche Ideen, was ich falsch mache?
Beispiel (man achte auf die weißen Striche links und rechts):
Der einzige Unterschied zwischen den beiden Dateien ist, dass ich einmal bei den inneren Boxen "float:left;" auskommentiert habe
Grüße
Marc
-
Hallo,
Eigentlich kein großes Problem - dachte ich. Nun muss ich feststellen, dass - sobald ich die inneren Boxen nach links floaten lasse, mir das den Rand zerstört (im FF - warum auch immer).
Der einzige Unterschied zwischen den beiden Dateien ist, dass ich einmal bei den inneren Boxen "float:left;" auskommentiert habe
Die Eigenschaft float:left (bzw. float:right) löst die entsprechenden Elemente aus dem Elementfluss, legt sie praktisch in einen anderen Layer als die normal fließenden Elemente. Da das umgebende Element die Eigenschaft height:auto hat, nun aber keinen normal fließenden Inhalt mehr hat, der die Höhe automatisch vergrößern müsste, ist es 0px hoch. Du musst entweder nach dem letzten gefloateten Element innerhalb des umgebenden Elements ein Element mir clear:left einfügen, welches den Elementsfluss wiederherstellt oder Du musst das umgebende Element auch floaten lassen.
Für den IE musst Du übrigens noch den doubled-margin-bug bekämpfen.
viele Grüße
Axel
-
Hiho,
danke für die Lösung!
Für den IE musst Du übrigens noch den doubled-margin-bug bekämpfen.
Wegen sowas zittert mein Finger immer, wenn ich dieses blaue "e" drücke um mein Werk zu überprüfen...
Marc
-
-
Hi,
mir das den Rand zerstört (im FF - warum auch immer).
die Erklärung hat Dir Axel ja bereits gegeben. Aber schau mal ganz genau oben links und rechts hin, da siehst Du noch einen winzigen Teil Deines borders...
freundliche Grüße
Ingo