28172 sujets

CSS et mise en forme, CSS3

[Résolu] Faire un menu fixe qui n'est pas sujet à la scrollbar

Bonjour,

Pour commencer, voila un exemple assez vulgaire de ce que je cherche à avoir : http://img32.imageshack.us/img32/5940/exempley.jpg

J'aimerais avoir un menu, lequel serait situé en haut de la page et qui serait fixe, indépendant du reste de la page qui lui sera du contenu, en gros quand l'utilisateur fera défilé la page le menu en haut restera fixe et le contenu défilera sans jamais interagir avec le menu du haut

Ma page contient 1 div principal, contenant deux div, le premier contenant le menu haut et le deuxième le contenu, il y'a un seul fichier css et je préférerais ne pas utiliser les frames

Pour l'instant voila ce que j'ai dans le fichier css :
.page {
  width:800px;
  background-color:#0099FF;
}

.menufixe {
  top: 0;
  position : fixed;
  margin-left: auto;
  margin-right: auto;
  width: 800px;
  z-index: 2;
  text-align: center;
  background-color: #ffffff;
  line-height: 2em;
}

.content {
  z-index: 1;
  padding-top: 3em;
  background-color:#FF0000
}


Avec firefox c'est nickel, mais avec IE le menufixe n'est pas collé au haut de page (top: 0px;) et lorsqu'on fait défiler la page le menufixe disparait (il défile)
Modifié par alias_is (08 Sep 2009 - 21:46)
alias_is a écrit :
mais avec IE le menufixe n'est pas collé au haut de page

Le positionnement fixe n'est pas implémenté dans Internet Explorer 6. La solution consiste à s'en ficher royalement, ou bien à utiliser rien que pour IE6 un script JavaScript pour réaliser sensiblement le même effet (avec un rendu parfois moins convaincant).

Par contre dans IE 7 et 8 ça devrait marcher. Si ce n'est pas le cas, c'est que tu travailles en mode Quirks (et donc tu brûleras en enfer entouré de pages Geocities datées de 1997 Smiley cligne ).
Salut,

Est-ce que ta div .menufixe est dans .page ?
Ta div contenant le menu fixe doit avoir comme parent direct : body.
Modifié par pfoofen (04 Sep 2009 - 19:30)
pfoofen a écrit :
Ta div contenant le menu fixe doit avoir comme parent direct : body.

À ma connaissance, non, il n'y a pas de telle contrainte pour le positionnement fixe.
En farfouillant un peu j'ai vu qu'en ajoutant :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">


avant 
 <html>
ça marchait, quelqu'un pourrait-il m'expliquer pourquoi?

Sinon pfoofen maintenant que ça marche aussi sous IE je confirme que ça n'influe pas

En vous remerciant pour votre aide !
Sujet clos
Aller à