Vertikaler Abstand von <hr>-Elementen im IE

[Axel Richter]

Hallo,

Bei der CSS-Formatierung von <hr>-Elementen ist mir aufgefallen, dass der IE größere vertikale Abstände macht als angebeben.

Ja, das ist ein bekannter IE-Bug.

Im Beispiel (margin: 1px 0;) lassen Mozilla und Opera genau 1px zwischen den Linien, wogegen der IE ca. 16px freilässt. Wie lässt sich das Verhalten des IEs hierbei erklären?

Erklären lässt es sich nicht, es ist einfach falsch. Soweit ich weiß, gibt es auch keine Lösung.
Workaround: Man verwendet einfach keine HR-Elemente, sondern border-top und/oder border-bottom von vorhandenen Block-Elementen für horizontale Trennlinien.

Und warum mach Mozilla 1px Abstand zwischen den Linien, müsste der korrekte Abstand nicht 1px+1px = 2px (boder-top + border-bottom) lauten?

Nein, 1px+1px = 2px (margin-top + margin-bottom), oder wo setzt Du border? Hier gilt allerdings http://www.w3.org/TR/CSS21/box.html#collapsing-margins.

viele Grüße

Axel