[Résolu] Superposition d'image innefficace sous Chrome / Android

Bonjour,

Je viens de mettre en ligne récemment la nouvelle charte graphique d'un site.
Sur la page d'accueil, il y a un carrousel qui fait défiler des slides contenant une image et du texte.

Sur certaines slides, j'ajoute en plus une pastille "Nouveau" qui apparaît par dessus l'image et le texte.
En local, j'ai fait mes tests avec IE, FF et Chrome et tout se passait bien. J'ai donc procédé à la mise en ligne et j'ai enfin pu tester depuis un smartphone. Mauvaise surprise, sur un smartphone Android utilisant Chrome, la pastille "Nouveau" ne s'affiche presque pas. Toute la partie positionnée "devant" l'image (soit 90% de la pastille) n'apparaît pas.

Sans trop y croire, j'ai ajouté l'attribut "overflow:visible" à la classe de la pastille... et effectivement, cela ne change rien.

Voyez-vous une solution ?

L'url de la page en question : http://www.voyage-net.com

Merci par avance pour votre aide

Ca ressemble à un problème de z-index. Passe le position:relative avec un z-index supérieur à 1 et ça devrait le faire normalement.

je suis à tout à fait d'accord avec vous !

Note de modération :
* Participation intéressante....
* Si la signature n'a d'autre but que de vous faire de la pub, dispensez-vous d'en mettre, ou utilisez la case prévue à cet effet dans votre profil, merci.
Modifié par 6l20 (08 Nov 2013 - 10:14)

Bonjour,

Merci pour cette réponse.

Je vais tester, en espérant que ça ne "pète" pas le carroussel.

Je vous tiens au courant

Impec ! Ca marche et ça n'a pas cassé le carroussel. Je craignais des conflits avec les css gérés directement par les JS de celui-ci.

Y a-t-il un bouton "résolu" sur ce forum pour fermer le sujet ?

J'ai trouvé ce bouton, c'est une option à cocher apparaissant sur le formulaire de réponse.

Je l'aurai plutôt placé sur la page principale de la discussion et non sur le formulaire de réponse.

J'imagine que c'est plus compliqué à intégrer à cet endroit dans le script du forum