hi,
kann mir das mal bitte einer erklären ...?
Ich habe ein OL, darin ein LI [1], und darin eine DL mit vier DT/DD-Paaren.
Jetzt blende ich das erste DT über display:none aus, das erste DD bekommt eine Höhe von 2em, etwas padding, kein margin, und einen Rahmen verpasst.
Die restlichen drei DT/DD-Paare bekommen alle eine Breite von 4em, und werden nach links gefloatet, so dass drei mal DT - DD nebeneinander stehen auf einer gemeinsamen Zeile.
Jetzt möchte ich diese drei Paare per negativem margin-top ein wenig nach oben "hieven", so dass sie über dem ersten, großen DT zu liegen kommen.
OK, margin-top für alle -1em - klappt wunderbar, nur liegen sie damit noch über dem unteren border des großen DD - siehe Beispiel #1.
Also möchte ich das negative margin-top noch etwas vergrößern, auf -2em.
Huh, what's that? - Beispiel #2 [2]
Opera (8.51) und Firefox (1.5) stellen plötzlich den Text aller drei hochgezogenen DT/DD-Paare auf einem Fleck übereinander dar!
IE 6 hat damit kein Problem, der stellt wie gewünscht die drei Paare noch etwas höher als im ersten Beispiel, und damit "innerhalb" des Rahmens des ersten DD dar.
Habe ich in der CSS-Spezifikation bzgl. float etwas übersehen, was dieses Verhalten von Opera und Firefox logisch und nachvollziehbar für korrekt erklärt?
Aber ich durch das Erhöhen des negativen Margins von -1em auf -2em irgendeinen für mich unsichtbaren Bestandteil des ersten großen DD "berührt", der dieses absonderliche Verhalten auslöst?
Oder ist das ein gemeinsamer Bug?
gruß,
wahsaga
[1] OL und LI tun nichts zur Sache, Verhalten bleibt auch ohne sie gleich.
[2] Die Hintergrundfarben der DT/DD aus dem ersten Beispiel habe ich hier entfernt, da man so besser erkennt, dass alle Textinhalte einander überlagern.
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }