Header fixed
kush91170
Messages postés
65
Statut
Membre
-
Kopros Messages postés 631 Statut Membre -
Kopros Messages postés 631 Statut Membre -
Bonjour à tous,
Je vous explique mon problème. Je créer un portfolio très simple en HTML et CSS. Le plan du site est très simple, il est composé d'un header qui fait toute la largeur du site et d'une section en dessous. Mon objectif est de pouvoir scroller en bas tout en ayant le header visible. J'ai donc mis le header en "fixed". Le seul problème est que lorsque je scroll, la section va traverser mon header comme s'il était transparent. Auriez-vous une solution à ce problème ? Je ne sais pas si j'ai bien expliquer mais j'attends vos questions si vous voulez plus de détails. Merci d'avance ! :)
Je vous explique mon problème. Je créer un portfolio très simple en HTML et CSS. Le plan du site est très simple, il est composé d'un header qui fait toute la largeur du site et d'une section en dessous. Mon objectif est de pouvoir scroller en bas tout en ayant le header visible. J'ai donc mis le header en "fixed". Le seul problème est que lorsque je scroll, la section va traverser mon header comme s'il était transparent. Auriez-vous une solution à ce problème ? Je ne sais pas si j'ai bien expliquer mais j'attends vos questions si vous voulez plus de détails. Merci d'avance ! :)
A voir également:
- Gpt header corruption has been detected
- Over current have been detected on your usb device ✓ - Forum Matériel & Système
- Warning your chassis has been opened ✓ - Forum Matériel & Système
- Over current have ben detected on tour usb device - Forum logiciel systeme
- Legi gpt - Télécharger - Intelligence artificielle
- Request header or cookie too large - Forum Webmastering
1 réponse
Si j'ai bien compris, la section passe par dessus le header quand on scroll.
Si c'est bien ça, il suffit de positionner la section, et de mettre un z-index plus élevé sur le header que sur la section.
En gros ça ressemble à peu près à ça :
<div id="header">
...
</div>
<div id="section">
...
</div>
CSS :
Dis moi si ça marche
Si c'est bien ça, il suffit de positionner la section, et de mettre un z-index plus élevé sur le header que sur la section.
En gros ça ressemble à peu près à ça :
<div id="header">
...
</div>
<div id="section">
...
</div>
CSS :
#header{
position: fixed;
z-index: 2;
}
#section{
position: relative;
z-index: 1;
}
Dis moi si ça marche
