nochmal: Bilder im div zentrieren

Hallo, schon vor zwei Monaten war dies mein Problem. Noch immer habe ich keine zufrieden stellende Lösung. Ich möchte nach wie vor ein Bild innerhalb eines quadratischen divs zentriert darstellen, möglichst nur, indem ich die HTML-Datei unangetastet lasse und dies nur über das CSS regele.
Einen Vorschlag von Jörg habe ich nochmal hier online gestellt.

Dummerweise funktioniert dieser Trick mit dem 1px-großen Leerzeichen nicht im IE. Das sagtest du, Jörg, damals schon. Leider hatte ich das verdrängt und jetzt stört mich sowas schon. Aber auch im Mozilla funktioniert die vertikale Zentrierung nicht korrekt. Der obere Balken erscheint kleiner als der untere.

Gibt es jetzt vielleicht noch neue, bessere Ideen als im Mai?

Danke für weitere Tipps!

Micha

Hallo Micha,

das Set background im HTML überschreibt wohl auch das Set background als ganzes im head bzw. in der CSS Datei. Wenn man trennt nach background-image, background-position und background-repeat, sollte es gehen:

    #vorschau .bild{
       width:120px;
       height:120px;
       background-color:blue;
       background-position:center center;
       background-repeat:no-repeat;
       text-align:center;
       margin:auto;
    }

und im HTML-Teil:

<td><a href="#"><div class="bild" style="background-image:url(102-0260_img.jpg);" title="Bild 1"></div></a><div class="gr">102-0260_img<br><span class="kl">Querformat mit etwas längerer Beschreibung, um zu überprüfen, ob das Ganze dann immer noch hübsch zentriert wird.</span></div></td>

zu welchem Zweck ich das transparent noch drin hatte, weiß ich auch nicht mehr :? es scheint aber auch ohne zu funktionieren :)