28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Quelqu'un peut m'expliquer pourquoi je n'arrive pas à mettre un background-position sur un png dans ie 6, mais je suis capable avec un gif.

a.icon-descendre {background:url(../images/icone-video.png) no-repeat -10px 0; text-indent:-9999px; display:block; width:17px;}
a.icon-descendre {background:url(../images/icone-video2.gif) no-repeat -10px 0px; text-indent:-9999px; display:block; width:17px;}

upload/16393-icone-vide.png upload/16393-icone-vide.gif
Salut,

Si tu as ces deux déclarations l'une à la suite de l'autre, il est tout à fait normal que cela affiche l'image en .gif puisque celle ci est déclarée en dernier.

Sinon, peut être faudra-t-il que tu nous en montre plus pour qu'on puisse te répondre. Il n'y a aucune raison que le png ne fonctionne pas avec IE, même avec le bidouillage pour obtenir la transparence.
Salam,

tu ne peux pas mettre png en arriére plan de cette méthode, tu peux tester avec lestyle suivant :

a.icon-descendre {url(../images/ficone-video.png);
_background:none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/ficone-video.png', sizingMethod='scale');}

ce style c'est pour afficher ton png en arriére plan, après tu peu le positionner comme tu veux
a écrit :
Si tu as ces deux déclarations l'une à la suite de l'autre, il est tout à fait normal que cela affiche l'image en .gif puisque celle ci est déclarée en dernier.


J'ai mis les deux lignes pour montrer que c'est identique mais si tu en mets une ligne en commentaire. tu verras que la différence entre les deux c'est qu'il ne prend pas le background-position avec le png. C'est comme s'il restait a la position 0 0 dans ie 6.

a écrit :

a.icon-descendre {url(../images/ficone-video.png);
_background:none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/ficone-video.png', sizingMethod='scale');}


J'utilise un javascript qui me permet d'afficher les png dans ie6.
Modifié par britanicus75 (03 Oct 2008 - 18:14)
j'ai déjà eu ce type de problème et pour le résoudre je ne met pas mon image png en backgroud je la positionne en absolute et je positionne dessus mon texte avec un z-index plus grand et tous vas bien