J'essaie d'animer 6 images dans une boucle infinie.

Lorsque j'ajoute la 6ème image et la classe "poster", aucune image n'apparaît, mais si j'omet d'ajouter la classe "poster" à la 6ème colonne (ou image), les 5 premières images s'affichent correctement et animation.

Je ne comprends pas pourquoi cela se produit.

Comme vous pouvez le voir, la classe "poster" n'est pas dans la sixième colonne, donc mon code fonctionne, mais dès que j'ajoute cette classe, il cesse de fonctionner.

(j'utilise bootstrap 5 mais je suis sûr que cela n'a rien à voir avec ce problème car le code tel que je le montre reproduit parfaitement le problème)

@keyframes se déplace { à { position d'arrière-plan : -100vw 80 % ; } } .galerie { position : relative ; débordement caché; } .affiche { position : absolue ; animation : moveAcross 6s linéaire infini ; } .affiche-1 { délai d'animation : -0s ; durée de l'animation : 6 s ; } .affiche-2 { délai d'animation : -1 s ; durée de l'animation : 6 s ; } .affiche-3 { délai d'animation : -2 s ; durée de l'animation : 6 s ; } .affiche-4 { délai d'animation : -3 s ; durée de l'animation : 6 s ; } .affiche-5 { délai d'animation : -4 s ; durée de l'animation : 6 s ; } .affiche-6 { délai d'animation : -5 s ; durée de l'animation : 6 s ; } @keyframes moveAcross { 0% { gauche : -300px ; } 100 % { gauche : 110 % ; } }