[CONTRIBUTION] une deuxième barre de menu

Nombre de messages : 31 Date d'inscription : 19/02/2006

Bonjour,

J'ai ajouté une deuxième barre de menu pour pouvoir mettre des liens en dur. Comme ça fonctionne bien, je poste les modifications, au cas ou il y aurait des amateurs.

Modifications dans \squelettes\rep_css\biospip.css

création d'un style #navbar qui reprend tous les styles de #menu et qui ajoute un paramètre :

Code:: ul#menu, ul#navbar
   {
      height: 35px ;
      margin: 0 ;
      padding: 0 ;
      background: url(../rep_pics/biospip/bg_menu.gif) repeat-x 0 -25px ;
      list-style-type: none ;
   }

   ul#menu li, ul#navbar li
   {
      float: left ;
      text-align: center ;
   }

   ul#navbar li
   {
      display:inline ;
   }


   ul#menu li a, ul#navbar li a
   {
      width: 150px ;
      line-height: 25px ;
      font-size: 1.2em ;
      font-weight: bold ;
      letter-spacing: 2px ;
      color: #fff ;
      display: block ;
      text-decoration: none ;
      border-right: 2px solid #ab4 ;
   }

   ul#menu li a:hover, ul#navbar li a:hover
   {
      background: url(../rep_pics/biospip/bg_menu.gif) repeat-x 0 0 ;
   }

   ul#menu li.current, ul#navbar li.current
   {
      background: url(../rep_pics/biospip/bg_menu.gif) repeat-x 0 0 ;
   }

Modifications de \squelettes\inc_menu.html :

ajout, juste avant "<ul id="menu">" :

Code:: <ul id="navbar">
<li><a href="http://profdeboulange.phpnet.org/dev/">Accueil</a></li>
<li><a href="http://profdeboulange.phpnet.org/dev/phorum/">Forum</a></li>
<li><a href="http://profdeboulange.phpnet.org/dev/annuaire/annuaire_index.php">Liens</a></li>
<li><a href="http://profdeboulange.phpnet.org/dev/article.php3?id_article=1">Qui ?</a></li>
<li><a href="http.//www.aainb.com">AAINB</a></li>
</ul>

le résultat est visible ici :
http://www.technoboulange.com

Je ne sais pas si j'ai fait ce qu'il fallait, mais ça marche.

Cordialement
Fred Montessinos

Admin Nombre de messages : 173 Date d'inscription : 17/12/2005

Merci pour cette contribution, je pense qu'elle servira à tous ceux ayant déjà émis le souhait d'avoir une seconde barre de menu.

Nombre de messages : 22 Date d'inscription : 13/02/2006

Bonjour,

j'essaie d'utiliser votre contribution pour un site sous evaspip. Tout fonctionne à merveille... sauf l'alignement de la barre de menu ainsi créée.

A votre avis comment "centrer" la portion "navbar"?

Si je supprime le float, cela ne ressemble plus à rien...
Merci

André

Nombre de messages : 31 Date d'inscription : 19/02/2006

Bonsoir,
Je ne connais pas evaspip, et avec les css, je bidouille avec un taux de réussite très très moyen. les indications que je vais vous donner sont donc à prendre sous toutes réserves.

Dans le cas de la barre de menu de biospip elle n'est pas à proprement parler "centrée dans la page," elle occupe tout l'espace d'un bloc qui est lui-même centré dans la page.
J'ai regardé rapidement la construction de Eva, il me semble que c'est le même cas avec les paramètres définis dans div#Page.

float n'est pas en cause pour l'allignement de la barre, c'est pour l'alignement des textes des boutons dans la barre (définis par <li>)

Il y a sur alsacréations une partie beaucoup plus claire sur le sujet que ce je suis moi-même capable d'expliquer et qui doit correspondre à ce que vous cherchez :

http://css.alsacreations.com/Faire-une-mise-en-page-sans-tableaux/Centrer-les-elements-ou-un-site-web-en-CSS

En espérant vous avoir aidé quand même
cordialement
Fred

Nombre de messages : 22 Date d'inscription : 13/02/2006

Merci pour votre réponse...
Je suis moi-même un "bidouilleur" et je procède par essai-erreur: c'est cela qui est amusant avec les css.

Je vais aller voir le tutoriel que vous indiquez. En cas de réussite, je vous donnerai le lien

A+

André

Nombre de messages : 22 Date d'inscription : 13/02/2006

Voilà, grâce à votre explication et au tutoriel indiqué, je suis parvenu au résultat recherché.

A voir sur www.sjpa.be/spip C'est le menu horizontal qui a été modifié.

Merci

André

Nombre de messages : 3 Date d'inscription : 31/03/2006

Un grand merci à notre cyber boulanger : la bidouille qu'il propose fonctionne parfaitement. N'étant pas assez doué pour faire un menu en cascade ou autre, j'ai opté pour sa proposition et ça me va très bien : http://grenouille-yzeron.ifrance.com/

Merci à lui

» [RESOLU] Personnaliser la barre de menu
» [RESOLU] Centrer le menu
» Créer un menu sur la gauche ou droite
» [RESOLU] titre dans le menu
» Transformer le menu horizontal en vertical...