18073 sujets

Questions générales et questions de débutants

Menu horizontal comme faire pour le centrer

Administrateur
mistered a écrit :
Je ne vois pas comment faire pour centrer le menu. Quelqu'un pourrait m'eclairer ?

Hello et bienvenue,

As-tu suivi le tutoriel sur le centrage des éléments ?
Si oui, quels problèmes te pose-t-il ?
Modérateur
bonjour,

essai en appliquant :

position:relative;
z-index:100;

aux elements de #menu (dl,dt,dd,ul,li);

ceci fonctionne bien avec la page demo, remarque que l'element appeler #site, est positionner en absolute et ne sera donc pas repousser par le menu ...

Si tu ne veut pas ou peut pas placer ton "site" en absolute alors, essai d'appliquer a nouveau un
position:absolute;
width:100%;

aux elemnt dd de #menu.



ensuite, pour centrer ton menu il te suffit de donner une taille en largeur a #menu avec un margin:auto; et en enlevant le position:absolute; et le z-index associé, ainsi que les coordonnées de disposition devenues inoperantes.

++
re,

Petite précisions qui n'est pas des moindre je suis sous IE6 (je sais je vous entend d'ici mais dans ma boite il utilise ca donc je dois composer avec)

gcyrillus : J'ai essayé ce que tu m'as dis mais le menu reste aligner sur la gauche

J'ai regardé un autre tutorial (très bien fait lui aussi) : http://css.alsacreations.com/Faire-une-mise-en-page-sans-tableaux/Centrer-les-elements-ou-un-site-web-en-CSS

Et j'ai donc mis ca dans mon #menu

#menu {
position: relative; 
margin-left: auto;
margin-right: auto;
width: 100%;
}


Mais pas d'effet

Je n'ai pas touché au reste.
Bonjour mistered,

mistered a écrit :
re,
Petite précisions qui n'est pas des moindre je suis sous IE6 (je sais je vous entend d'ici mais dans ma boite il utilise ca donc je dois composer avec)


Beaucoup de membres sont aussi sur IE 6 et notre objectif est de rendre nos sites accessibles au plus grand nombre ...
Smiley smile
J'ai un debut de reponse quand je change la valeur du width

ex : 

#menu {
position: relative; 
margin-left: auto;
margin-right: auto;
width: 60%;
}


Suis je dans la bonne voie ? Smiley smile
Le probleme c'est quand je change de resolution ca ne positionne mal.

Je continue de creuser.
Modifié par mistered (10 Apr 2006 - 16:42)
Modérateur
re,

oui je t'ais bien dit que tu devais donner une largeur a ton menu. celle-ci ,quand elle est inferieur a la largeur de ta page avec un margin-auto; centrera l'element .

Si tu ne veut pas voir ton menu faire "l'accordeon", n'utilise plus les pourcentage , mais plutot des "em" ou "px" pour le dimensionner en largeur Smiley smile .

Bonne continuation.
Modifié par gcyrillus (11 Apr 2006 - 01:04)
Sujet clos
Aller à