DIV Höhe kleiner als Zeilenhöhe im IE

[da_loki]

Ich steh gerade irgendwie auf dem Schlauch.

Ich möchte gerne ein DIV mit einem Hintergrund als Designelement nutzen.
Jetzt komme ich zu dem Problem, dass der Internet Explorer hier meine Höhenangabe auf eine komplette Zeile erhöht.

<div style="position: relative; top: 20px; height:10px; width:10px; background-color: #FFCCCC;"></div>

Im FireFox ist alles so, wie es sein soll.
Der IE ignoriert die height-angaben, und macht diesen so hoch, wie eine Zeile sein würde.

Weiß da jemand Rat ?

*edit*

Nach langem Suchen und einem Tipp ist es einfach.
Der Internet Explorer geht auch bei einem leeren Element davon aus, dass dort Text drin steht.
Aus diesem Grund einfach "line-height" auf 1px festlegen, und es funktioniert.

 

[gruenspan]

Welchen IE nutzt Du? 5.0, 5.5, 6.0 ? Wenn ja, schreib mal in das Stylesheet vom Div folgendes:

font-size:0px;
line-height:0px; /* optional */

 

[da_loki]

Es war nicht abhängig von der IE Version.
Der IE7 hat es genauso daneben dargestellt, wie auch IE 5, 5.55 und 6...
Ist also ein allgemeiner IE Fehler.

 

[gruenspan]

Stimmt nicht! Version 7.0 stellt es ohne diese zusätzlich Angabe korrekt dar.(zumindest meine)
Der Fehler ging nur bis Version 6

 

[da_loki]

Komisch dass mein IE7 es nicht gemacht hat -.-

Ich hoffe gerade, dass ich mir meine IE7-Engine nicht zerstört habe ^^

 

[gruenspan]

Das ist natürlich seltsam :?