web-dev-qa-db-fra.com

Faire mon menu css rester en haut de l'écran?

comme dans http://facebook.com ils ont un type de barre de navigation qui reste en haut de la page, comment puis-je le faire avec mon code. J'ai mon menu avancé de css fonctionnant excepté celui un problème. bien voici mon lien vers mon jsfiddle 

Js fiddle

Principales parties de css

#cssmenu ul { margin: 0; padding: 0;}
#cssmenu li { margin: 0; padding: 0;}
#cssmenu a { margin: 0; padding: 0;}
#cssmenu ul {list-style: none;}
#cssmenu a {text-decoration: none;}
#cssmenu { height: 42px; background-color: rgb(35,35,35); box-shadow: 0px 2px 3px rgba(0,0,0,.4);}

maintenant, si je ne me trompe pas, cela doit être fait avec cette partie sinon vérifiez le JsFiddle

htmlcss3css
13
Jacob Anthony Tonna

Ajoutez ce qui suit à votre menu css:

#cssmenu {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
}

C'est fondamentalement comment ils le font.

37
An Phan

Ajouter une propriété fixe 

 #cssmenu {
          position:fixed;
 }
5
ShibinRagh

Cela peut être fait si vous utilisez: 

 position:fixed;
3
Janak

Juste une pensée, n'avez-vous pas besoin d'ajouter z-index: 1000; pour qu'il flotte sur tous les éléments de la page?

2
TLCJohn

Oui, vous pouvez ajouter z-index: 1000; pour le faire flotter au dessus de tout contenu. Comme dit RLCJohn ci-dessus.

1
user3389058

Utilisez ce css pour définir votre barre de navigation fixée sur le dessus. 

 #cssmenu {
   position:fixed;
   top: 0;
   margin:auto;
   left: 0;
   right: 0;
   width: 100%;
  }

Voici la démo: http://jsfiddle.net/SkuhZ/

1
Selvamani

Juste ces 3 feraient ..

position: fixed;
top: 0;
width: auto;
0
SadhanaP