Remplir dynamiquement une div avec des émoticônes

bonsoir,
j'essai de remplir une div avec des émoticônes d'une image.gif, mais je me heure a un petit souci, les émoticônes se répètent quelques fois, et je ne sais vraiment pas pourquoi.
voilà la démonstration https://jsfiddle.net/Toufi9/9mnwczj9/

Bonjour,
visiblement ton incrémentation en Y n'est pas la bonne, pourquoi ne pas simplement faire

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13

var X = 0, Y = 0, ligne = 1; for (i = 0; i <= 54; i++) { if (i % 8 == 0 && i > 0) { X = 0; Y -= 20; // fonction la taille d'affichage ligne++; } else { X -= 20; } // ... la suite ...

---

il te restera à gérer la dernière ligne pour laquelle il y a visiblement un décalage les icônes étant visiblement plus large.

PS : si j'ai bien compris ce que tu cherchais à faire !

parfait NoSmoking, c'est exactement ce que je cherchais à faire, un grand Merci.
puis je vais oser de vous demander des conseils a propos les icônes animées comme celles qui existent sur ce forum (la page sur laquelle on rédige les messages), d'ou je peux les télécharger avec les différentes tailles pour les utiliser en sprites css3?

Là je te laisse chercher car pas franchement utilisé ce genre de technique.

Si tu dois intégrer, dans une partie de texte, une icône provenant de ton sprite il te faudra bien avoir l'image seule pour l'intégrer simplement, alors autant avoir les images séparées quitte à ce que tu te fabriques ton propre sprite.