28172 sujets

CSS et mise en forme, CSS3

Bonjour,
J'ai mis un z-index à 10 sur mon header, et à 11 sur mon champs de recherche, pour que ma recherche apparaisse à cheval sur la ligne du bas de mon header.
Ça fonctionne sans problème sur Firefox et IE, mais pas sur Chrome ni Opera, ni Android...
Comment puis-je faire pour m'assurer que la disposition des éléments soit conforme à ce que je veux sur tous les navigateurs ?
Merci pour votre aide !
Il y a peut-être un display-quelque-chose qui fausse le truc, il peut être injecté en javascript (ça arrive avec jQuery). Mais sans plus de code, difficile d'en dire d'avantage...
Administrateur
Bonjour,

Ces éléments sont-ils positionnés (relative, fixed, absolute et euh sticky probablement aussi) ? Sans quoi z-index n'a aucun effet. Pourquoi ça fonctionnerait dans Fx et IE dans ce cas ? M'enfin mieux vaut commencer ses debugs par la base Smiley smile

Ces éléments sont-ils frères ? Sinon c'est plus compliqué…
Au temps pour moi je pensais avoir mis le lien mais j'ai oublié ! Le voici.
Par contre en lisant vos réponses j'ai ajouté (au hasard) un simple "position:relative;" à l'élément du "z-index:11", et ça marche !
C'est parfait. Merci pour votre aide.
Romanceor a écrit :
en lisant vos réponses j'ai ajouté (au hasard) un simple "position:relative;" à l'élément du "z-index:11", et ça marche !

Et nul besoin de hasard : en effet, cette option est un préalable obligatoire pour ce type de positionnement qu'est z-index.