Sprites retina > background-size et mise à jour du fichier sprite

Bonjour,

je bloque quelque peu sur une question pratique concernant les sprites et leur usage en contexte "retina" avec la propriété background-size, lorsque celle-ci est utilisée pour "réduire" l'image par deux. La propriété background-size prend alors une valeur égale à la taille réelle de l'image divisée par deux.

Problème :
Si je dois agrandir mon sprite pour lui rajouter des icones, je devrai modifier la valeur background-size partout où elle est utilisée.

Question :
Quelqu'un aurait-il une astuce ou un conseil pour aborder les choses sous un angle plus adéquat et éviter ainsi d'avoir à modifier la valeur background-size partout où elle apparaît ?

Par avance, un grand merci pour votre aide
Modifié par BeautifulWeb (16 May 2014 - 10:11)

Une solution pourrait consister à prévoir un espace vide dans le sprite pour pouvoir y ajouter de nouveaux pictos sans modifier la taille de l'image (le vide ne pèse pas très lourd en png)...

Quelqu'un en verrait-il une plus subtile ?

Le vide pourrait ne pas suffire, un jour : ce n’est donc pas très pérenne.

Pourrais-tu nous donner le CSS correspondant à ton sprite et ses utilisations ? Il est certainement possible de re-factorer un peu ton CSS pour ne citer qu’une seule fois le background-size...

Personnellement j’utilise Sass + Compass + quelques mixins persos et tout est généré automatiquement, donc pas besoin de se re-prendre le chou à chaque modification. C’est plutôt sympa

Merci pour cette réponse. Je n'ai pas encore de fichier CSS à vous montrer, je réfléchissais dans l'absolu.

Mais l'idée de factoriser au maximum le background-size paraît être la piste la plus simple pour l'instant (sachant que mon code ne fera pas 150.000 lignes).

Pour SASS & Cie, effectivement, il faudra que je m'y colle un jour...