IE-Bug: AlphaImageLoader mit width:auto

[Cheatah]

Hi,

man nehme:

<style type="text/css">
  * html div.png     { width: 100%; }
  * html div.png img { visibility: hidden; }
</style>
[...]
<div class="png" style="background-color: #FF0000; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='[...].png', sizingMethod='scale');"><img src="[...].png" alt=""/></div>

Ziel ist - man ahnt es schon - die Darstellung eines teiltransparenten PNG. Jener Code oben funktioniert. Ändert man den width-Wert aber auf "auto" (oder "inherit" :-), ist plötzlich das Bild weg - und erscheint wieder, wenn man das <div> floaten lässt.

Ist das ein bekannter Bug? Worauf ist er zurückzuführen?

Andere Frage nebenbei: Fällt jemandem ein Weg ein, die filter-Eigenschaft dem <img> zuzuweisen und _das Bild selber nicht darstellen zu lassen_? Ich würde gerne auf das umgebende Element verzichten ...

Cheatah

[schwarze Piste]

Tachchen!

<style type="text/css">
  * html div.png     { width: 100%; }
  * html div.png img { visibility: hidden; }
</style>
[...]
<div class="png" style="background-color: #FF0000; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='[...].png', sizingMethod='scale');"><img src="[...].png" alt=""/></div>

Ich habe schon festgestellt, dass ich heute nicht sonderlich gut drauf bin,
aber warum hast du überhaupt das Bild noch als Bild eingebunden?

Die eigentliche Frage dahinter: Stellt sich dein Problem auch,
wenn es ausschließlich als Hintergrundbild eingebunden ist und
nie irgendwo visibility:hidden im Quelltext auftaucht?

Gruß

Die schwarze Piste

[Cheatah]

Hi,

aber warum hast du überhaupt das Bild noch als Bild eingebunden?

damit auch nicht-IEs damit klar kommen :-)

Die eigentliche Frage dahinter: Stellt sich dein Problem auch,
wenn es ausschließlich als Hintergrundbild eingebunden ist und
nie irgendwo visibility:hidden im Quelltext auftaucht?

Nein, dann muss ich aber auch die Größe explizit angeben, während sie so durch das <img> reserviert wird.

Cheatah

[schwarze Piste]

Tachchen!

damit auch nicht-IEs damit klar kommen :-)

Die eigentliche Frage dahinter: Stellt sich dein Problem auch,
wenn es ausschließlich als Hintergrundbild eingebunden ist und
nie irgendwo visibility:hidden im Quelltext auftaucht?

Nein, dann muss ich aber auch die Größe explizit angeben, während sie so durch das <img> reserviert wird.

Also wenn ich das jetzt in der Zusammenschau richtig verstanden habe,
wäre das Problem doch gelöst, wenn du dir statt des Bildes etwas mit
Hintergrundbildern ausdenkst, dass auch Nicht-IEs verstehen und die Größe
dann dem DIV zuweist.

Wenn also nicht das PNG inkl. Größenangabe aus einer (Datenbank-)Quelle kommt,
auf die du keinen Einfluss hast, kann ich gerade mal das Problem nicht sehen!?

Gruß

Die schwarze Piste

[Cheatah]

Hi,

Also wenn ich das jetzt in der Zusammenschau richtig verstanden habe,
wäre das Problem doch gelöst, wenn du dir statt des Bildes etwas mit
Hintergrundbildern ausdenkst, dass auch Nicht-IEs verstehen

ein <object> oder Inline-Grafiken beispielsweise? Hm, erscheint mir beides ein wenig zu kompliziert und umfangreich. Ich werde den Gedanke aber im Hinterkopf behalten, danke für den Tipp.

und die Größe dann dem DIV zuweist.

Idealerweise sollte die Größe auch ohne explizite Angabe korrekt sein; auch wenn diese Angabe natürlich dringend empfohlen ist.

Wenn also nicht das PNG inkl. Größenangabe aus einer (Datenbank-)Quelle kommt,

Ich denke an eine schematische Lösung, die von irgendwelchen Redaktions-Tools angewendet wird, oder auch bei anderweitigem dynamischen Erzeugen des Codes, ohne dass die entsprechenden Personen irgend etwas darüber wissen müssen. Etwas Allgemeingültiges halt, das einmal gebaut wird und dann so einfach ist, dass es jeder ohne Probleme einsetzen kann.

Ich habe übrigens inzwischen entdeckt, dass die Grafik auch dann angezeigt wird, wenn man eine explizite Höhe angibt. Sind width _und_ height auf auto (und das Element weder gefloatet noch absolut positioniert), wird es nicht angezeigt.

Cheatah