Problème pour centrer menu

Salut a tous je suis nouveau sur ce forum et je voudrais déjà vous demandez de l'aide...


donc comme le dis l'intitulé de ce post, je n'arrive pas a centrer mon menu sur ma page voici le CSS

ul#menu {
margin: 0 ;
padding: 0 ;
list-style: none ;
text-align: center ;
width: 100%;
}

ul#menu li {
float: left;
}

ul#menu a {
float: left;
margin: 0 2px;
padding: 5px 15px;
text-align: center;
border: 1px solid gray;
text-decoration: none;
color: #000;
background: #fff;
}

ul#menu a:hover {
background: #ccc;
border: 1px solid gray;
}


et pour l'html:

<ul id="menu">
<li><a href="index.html">Acceuil</a></li>
<li><a href="reglement.html">Reglement</a></li>
<li><a href="historique.html">Historique</a></li>
<li><a href="liens.html">Liens</a></li>
<li><a href="liste de force.html">Liste</a></li>
<li><a href="http://ttsainthubert.informe.com/">Forum</a></li>
</ul>



je dois rendre mon travail demain merci d'avance pour vos réponses.

tu veux centrer que le menu ou toute ta page?
sinon

body {
     position: relative; 
     margin-left: auto;
     margin-right: auto;
     margin-top: 0px;
     width: ta largeurpx;
     
}

Modifié par maximelev (23 May 2007 - 17:41)

bonjour

je ne veut pas poster un autre sujet, pour la méme question, alors je viens là... (preuve que j'ai cherché... )

en fait j'ai le meme probleme, j'ai essayer cette solution et bien d'autres mais je ne parvient pas a centrer mon p**** de **** menu.

mon objetif: centrer le menu et le mettre dessous mon image d'entete..

je pense que le problème vient de mon code "bordelique" et qui m'empéche d'arriver a mes fins..

mon site ici

merci

Si vous voulez centrer les éléments dans le menu, ajouter un simple
text-align : center;
au conteneur du menu

Si c'est le bloc menu tout entier que vous souhaitez centrer, ça se passe toujour dans le conteneur du menu et :
- la largeur de ce conteneur détermine là où sera centré le menu
- en utilisant le tuto Centrer les éléments ou un site web en CSS pour centrer sur tous les navigateurs, je fais comme ça:

#conteneur-menu {
 (...)
 text-align	: center; 		/* corrige le bug de centrage IE */
 }
#menu {
 margin		: 0 auto;
 width		: 10em;
 }

Bonjour et bienvenue parmi nous Geotitof

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle.

D'ailleurs, je rappelle que le lien qui apparaît en bandeau tout en haut du forum ("Nouveau sur le forum ?...") est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Bonne continuation

upload/1-code.gif

re

désolé de revenir la dessus mais ca ne fonctionne pas non plus...

peut etre que ce n'est tout simplement pas possible???

merci

Bonjour,

Essaye :

#menu {
position: absolute; /* placement du menu, à modifier selon vos besoins */
top: 0;
left: 50%;
margin-left: -369px /* 738 divisé par 2 */
z-index:100;
width: 738px
}

Modifié par ghost (26 May 2007 - 20:19)

merci beaucoup ghost...
je commencer a perdre espoir, car jusqu'a présent je ne parvenait a faire bouger le menu...
j'ai donc réussi a le posisionner a l'endroit ou je voulait sauf que:
-sachant qu'il est positionner avec des %, il ne reste pas fixe, il se modifie selon la taille de l'ecran/fenetre... (il change donc de position!!)

Bonjour,

Et en positionnant le bloc tout simplement avec des marges ?

#menu {
	position:absolute;
	z-index:100;
	width:738px;
	margin:100px 0pt 0pt 100px;
}

Une remarque générale cependant : tu as énormément de blocs (divs) qui ne semblent pas particulièrement utiles pour ta mise en page. Il doit être difficile de s'y retrouver...
Par ailleurs, il faudrait corriger les erreurs HTML que te renvoie le validateur du W3C (j'obtiens 187 erreurs et avertissements, mais certaines erreurs de syntaxe peuvent déclencher des incompréhensions à la chaine du code par le validateur ).