div in ie7 -> bug oder feature

[smyd]

Ich find das sehr komisch.

Was ich will ist einfach einen Balken mit abgerundeten Ecken, also dachte ich mir machst einfach:

<div style="position:relative; width:773px; height:5px; background-color:#B7CDFC;">        
    <img src="images/lu.gif" height="5px" width="5px" align="left"/>
    <img src="images/ru.gif" height="5px" width="5px" align="right"/>
</div>

Ist ein blaues div und am linken und rechten Rand ist jeweils ein Bild das dir Rundung erzeugen soll.
Firefox zeigt es richtig an, jedoch IE7 macht vor den Bildern 1px abstand.


Plan B:

<div style="position:relative; width:773px; height:5px; background-color:#B7CDFC;">        
    <div style="position:relative; top:0; left:0; background-image:url(images/lu.gif); height:5px; width:5px; background-repeat:no-repeat;"/>
    <div style="position:relative; top:0; left:768px; background-image:url(images/ru.gif); height:5px; width:5px; background-repeat:no-repeat;"/>
<!-- -->
</div>

Und Da wirds jetzt gans lustig. Hier wird es im IE7 richtig dargestellt nur wenn ich das Comment <!-- --> entferne, legt IE7 bei der height noch 5px drauf.

Ist das ein Bug oder feature?
lg Stephan

 

[gruenspan]

http://www.html.de/html-und-xhtml/14582-faq-woher-kommen-die-abstaende.html

Und manchmal interpretiert der IE Leerzeichen im Code als Zeilenumpruch.