Résolu Centrer le menu principal

Bonjour,

J'aimerais centrer le menu principal afin qu'il soit toujours au milieu, et peu importe la résolution des écrans. J'ai pu le faire avec mon logo, mais je n'ai pas réussi avec le menu. Un peu d'aide serait sympa, merci! ^^

http://drcut.eklablog.com/

Bon dimanche.  

Salut !

Chouette page d'accueil !

Dans Apparence -> Modifier le thème -> En-tête (header) -> menu , il y a "position du menu en haut" , ça devrait faire l'affaire avec un peu de chance ! J'imagine que quand c'est centré c'est centré , peu importe la taille de l'écran ...

Bonne chance !

Salut!

Merci pour ta réponse, mais justement le problème, c'est qu'il n'y a pas cette option pour centrer le menu comme pour le logo. Et dans le CSS avec le code :

#menu{margin : 0 auto;}

Il ne centre pas non plus, alors qu'il devrait.

Il bloque à cause des paramètres définies : par rapport au bord gauche ou droit et par rapport au bord supérieur ou inférieur. Et quand on fait avec les pourcentages pour s’adapter aux différentes résolutions il y a toujours des décalages.

J'aime bien aussi ton blog. ^^

Bonjour,

le "responsive" (format adaptatif aux tailles d'écran) ne fonctionne pas chez EB. Il faut jouer avec les marges et les largeurs des éléments... du blog, de la page, des menus et des espaces respectifs (sortir la calculette ) 

Probablement que via le css effectivement c'est jouable mais là, perso je maitrise pas assez... pour info quand je vais sur ton blog je vois tout bien centré, quand je réduis la fenêtre le menu du header passe sur 2 lignes mais reste centré : tu veux centrer ce qui est déjà centré ?

Bonjour DrCut,

Comme indiqué par Petit Kalepin, tu as bien dans les paramètres l'option pour centrer ton menu.

PS N'oublie pas d'enlever les codes mis dans le css et qui effectivement ne servent à rien.

Bonjour Pipiou,

Tu as compris ce que je voulais faire! En fait, si on peut! Mais tu as raison, il faut jouer avec les pourcentages et les codes pour le faire. Je sais que le blog s'adapte sur le smartphone, tablette, PC portable, mais sur des très grands écrans, le menu n'est pas bien centré. C'est étrange qu'on puisse centrer le logo facilement mais pas le menu. Merci pour ta réponse. ^^

Bonjour Colette95,

Je me suis mal exprimé. Je cherche à faire un blog adaptatif aux différentes tailles d’écrans. Tout s’adapte sauf le menu. J'ai vu cette option, et effectivement on peut centrer avec des px mais il sera statique et ne s’adaptera pas aux différentes tailles d’écrans. On a la possibilité avec le logo mais pas avec le menu. Merci pour ta réponse. ^^

Essaie ces codes : 

#menu {
    position: absolute;
    top: xx%;
    left: 50%; /*important pour qu'il reste toujours centré*/
    margin-left: -xx%;
}

Comme ton blog est configuré en pourcentage, à toi d'adapter ceux-ci.

Non, ça ne fonctionne pas. Normalement avec le code css :

#menu {margin:0 auto;}

Il devrait centrer le menu partout tout comme le logo. Mais le problème c'est l'option obligatoire position de menu et même avec 0, il ne le centre pas correctement. 
Sur le smartphone on ne voit qu'une partie.
Ce n'est pas grave. L'essentiel, c'est qu'il s'adapte.
Merci pour ton aide.

Pas d'accord.

Pour l'instant tu as configuré dans les paramètres : 

#menu {
      list-style-type: none;
      margin: 0;
      padding: 0;
      position: absolute;
      top: 60%;
      left: 15%;

}

et ensuite tu as ajouté dans la feuille de style : 

#menu{
     margin:0 auto;
}

Tu ne crois pas qu'il y a comme une certaine contradiction dans le css ? 

Pas tout à fait.

Oui, j'ai laissé la formule correcte dans la feuille de style car l’interprétation diffère selon les navigateurs. Et pour le menu dans les options du blog, nous n'avons que deux choix.
Effectivement, j'ai mis la position horizontale x = 15% et verticale y = 60%. Pour la position d'origine, elle doit être plutôt relative, car elle s'adapte plus ou moins selon les tailles. Alors que la position absolue est statique. Le problème vient du centre, il ne centre pas sans le x et y. C'est très étrange... alors que le margin : auto; centre normalement tout seul, et sans problème. Le créateur du blog a omis l'option du centre dans le menu principal. Alors qu'avec le logo, il n'y a pas de problème.
Mais à l’époque le smartphone ou les tablettes n’étaient pas aussi utilisés. Aujourd’hui, 5 milliards de personnes dans le monde utilisent des smartphones.