[reglé] CSS PNG IE, pas de solution :(

Bonjour,
d'après le titre on va certainement penser que c'est l'éternelle question de la transparence PNG en CSS sous IE6. Et bien oui.

voici les méthodes que j'ai utilisées qui n'ont pas fonctionnées :

#mondiv{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/black-60.png", sizingMethod="scale");
}

background-color:#ffaaff;
-moz-opacity:0.5;
opacity: 0.5;
filter:alpha(opacity=50);

background:transparent url(../images/black-60.png) no-repeat top left;  
_background:none; 
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/black-60.png', sizingMethod='scale'); 

Je suis vraiment à cours d'idée. Aucune de ses méthode n'affiche de couleur de fond sous IE (excepté la première méthode m'affichant un somptueux fond rose opaque)

Avez vous d'autres méthodes ?
Merci infiniment pour votre aide.
Modifié par tynmar (14 May 2007 - 11:07)

Salut Tynmar, serais t'il possible de voir l'image de fond en question ? Ca se trouve, un simple Gif suffirait ?

Hello

A peu de choses près ton code est similaire au mien (qui fonctionne parfaitement )

Essaye :

- de mettre des simples cotes plutôt que des doubles,
- de rajouter un background-image:none;

#tondiv {
background-image:none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/black-60.png', sizingMethod="scale"); }

je viens d'essayer ta méthode BeliG, IE ne me sort aucun background

mon PNG est un simple carré de 15*15px rempli de noir avec une opacité à 60%

pour info, j'ai créé cette image avec Gimp

Salut,

Je n'ai pas essayé la solution avec filter mais pour résoudre ce problème, je suis toujours passé par le petit utilitaire TweakPNG disponible sur cette page :

http://www.antp.be/PNG/#liens

Faut juste éditer l'image et supprimer la ligne gAMA

salut Koala,

ici il s'agit de liens montrant les méthodes pour afficher une image PNG insérée dans le html de cette forme :

<img src="monimage.png" alt="un png dans du html" />

alors que je veux afficher une image png dans un fond d'un bloc (en CSS).

oui mais qu'est-ce que ça change ?

L'utilitaire ne fait que supprimer le fond rose. Que l'image soit placée en dur ou en background d'une div, le résultat est le même.
Modifié par koala64 (10 May 2007 - 15:27)

Il me semble (et je peux me tromper) que l'utilitaire va regarder toutes les balises <img /> contenant une source png et s'appliquer.
I'image est invisible dans le code html.

Enfin sur ce coup je serai heureux d'avoir tort.


OK pour tweakPNG, je vais l'essayer, merci
[/erratum]
Modifié par tynmar (10 May 2007 - 15:31)

Apparement les probèmes de transparence sont différents des problèmes d'opacité... Jette un coup d'oeil sur ce topic :

Opacité IE

merci BeliG;

pouvez vous me faire uns petite leçon sur les différences entre opacité et transparence, je ne vois pas bien ...merci

tynmar a écrit :

background:transparent url(../images/black-60.png) no-repeat top left;  
_background:none; 
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/black-60.png', sizingMethod='scale'); 

Le truc à savoir quand on utilise ce genre de trucs : l'url que tu utilise dans la propriété filter doit être relative au document (la page html) et non à la CSS comme pour la propriété background :

background:transparent url(../images/black-60.png) no-repeat top left;  
_background:none; 
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/black-60.png', sizingMethod='scale');

Une url absolue fonctionne également.

Plus de détails ici

Merci beaucoup MrPatate, c'est effectivement la solution.

Bien penser à utiliser le chemin depuis la page html et non pas depuis la feuille CSS (ce qui est une logique qui ne m'étonne point de la part de microsoft).

Merci beaucoup.