28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'aimerais adapter ces icones (sprites) à des vieilles versions d'IE.
Le problème c'est que le background-size ne passe pas dans les IE du coup, les icones sont fort décallées.

J'ai vu qu'il y avait moyen d'utiliser les
"filter: progid:DXImageTransform.Microsoft.AlphaImageLoader" mais cela ne semble pas fonctionner ou je ne les utilise pas correctement...

Voici le code de base. Quand je veut mettre l'icone, dans ma div j'ai class=icone et le id=contact par exemple

.icones {
background: transparent url('../img/icones.png') no-repeat;
display: inline-block;
width: 50px;
height: 48px;
background-size: 60px;
}

#contact {
background-position: 0px -60px;
}


Merci d'vaance
Administrateur
Bonsoir,

Compatible ou non, background-size ne te sera d'aucune utilité pour les sprites.
En effet, un background-size : 60px auto va redimensionner *toute* l'image de fond, donc l'ensemble de tes sprites réunis feront 60px de large et non chacun séparément.

Si tu veux un bon outil pour cela, je te conseille vivement Stitches, testé et approuvé !
http://draeton.github.io/stitches/
Hello,

Merci de ta réponse Smiley smile

Le background-size s'applique avant le backgound-position, donc en plus du fait que les images dépassent, les valeurs du background-position sont erronnées, donc rien ne va plus Smiley lol

Je regarde ton stitches et si pas, j'utiliserai une image pour faire le sprite à bonne taille (soit 60px de large) ...