Moin moin!
Okay, fassen wir meine Ergebnisse zusammen:
Das Problem sind die IMG-Tags, ich habe aber noch nicht rausgefunden, warum der IE da einen Extraabstand von 3px macht, selbst wenn man padding, margin und border auf 0 setzt.
Lösungsansätze:
- Simple, aber unvollständig
Einfach den Doctype ersetzen:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Dann funktioniert es mit IE6, aber nicht mit den alten 5ern.
- Simple, aber sehr schlechtes Markup
Ersetze <img src="rot.jpg" alt=""> durch <div class="img"></div>.
Erstelle folgende CSS-Regel:
.img
{
float:left;
width:50px;
height:50px;
background-image:url(red.jpg);
}
- Simple, Markup nicht optimal
Gibt dem Bild links und rechts verschiedene Klassen:
<img src="rot.jpg" alt="" class="links">
<img src="rot.jpg" alt="" class="rechts">
Und im CSS dann:
* html .links { margin-right:-3px; }
* html .rechts { margin-left:-3px; }
- Die einfache und elegante Lösung
Ein IE-CSS-Hack, den ich leider noch nicht entdeckt habe. :-(
ciao,
hofi