Discussion :

[sebhm]

Bonjour,

sur une page existante, j'essaie de fixer mon div #header en haut de ma page afin d'avoir mon menu toujours accessible lors du scroll;
En dessous, j'ai mon div #contenu.

J'utilise donc pour #header

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

position : fixed;

J'applique une marge à #contenu de la hauteur de #header.
J'applique à #header un z-index supérieur à celui de #contenu afin que ce dernier passe dessous lors du scroll.

Pas de probleme sauf :
- pour mes <form> qui passent au dessus du header lors du scroll (peu importe les éléments à l'intérieur de mon form : input, select...)
- pour certains elements isolés qui passent au dessus.

Pourtant, pas de z-index spécifié sur ces éléments (et si j'en met un inférieur à celui de #header, ca ne change rien).

A priori, c'est bien à cause des balises <form> que j'ai le probleme car si je les enleve, c'est OK.
Et pour mes éléments isolés, "position:relative" semble être la source du probleme.


je ne comprends pas vraiment pourquoi ?
y'a t-il une regle à connaitre que je connais pas ?
ou ai-je fait une connerie ailleurs ?

merci de vos lumières

[sebhm]

pour les <form>, c'est egalement

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

position : relative;

qui entraine ce comportement.

je continue ma recherche !

[Macmillenium]

Ta div #contenu est-elle positionnée?

[sebhm]

ca ne change rien que je la positionne en "relative" ou que je ne fasse rien

[c_s_s]

Lorsque j'essaie de reproduire ton problème je n'y arrive pas. Les éléments de formulaire passent bien sous le Header.

On peut voir ton code HTML/CSS ?

[sebhm]

bon j'ai corrigé le probleme en reprenant tout le CSS integralement
mais j'avoue que je n'ai pas compris où était mon probleme ...

merci