Un menu horizontal « full largeur » en CSS

Un menu horizontal « full largeur » en CSS

Un menu horizontal « full largeur » en CSS

Aucun commentaire sur Un menu horizontal « full largeur » en CSS Publié par

Après le menu vertical, voici maintenant un menu horizontal en full largeur sur 2 niveaux.
Celui-ci s’adapte automatiquement suivant la largeur de votre écran, cependant il faudrait pour un mobile adapter celui-ci en le passant verticalement.

Petite note, dans l’exemple il y a 4 liens de menus, pour en mettre plus ou moins il faut changer la largeur des liens de menu de la façon suivante :

La largeur total est de 100% – la marge de droite et de gauche de 2% chacune, ce qui fait une largeur total de 96%.
On a donc 96% / X liens de menu.

Voici quelques exemples :

  • Pour 3 liens, cela donne une largeur de 32%.
  • Pour 4 liens, cela donne une largeur de 24%.
  • Pour 8 liens, cela donne une largeur de 12%.

 

Et comme toujours la feuille de style est commentée, vous pourrez donc facilement l’intégrer dans votre site.

Démonstration

A propos de l'auteur :

Fondateur de DJWebCreator, développeur web et mobile. Également amateur de nouvelles technologies et de science-fiction.

Tags:

Laisser un commentaire

Les derniers Tweets

Suivre @djwebcreator sur Twitter.

Suivez-nous…

Back to Top