18041 sujets

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

[Résolu] Centrer un Menu

Bonjour, je viens de faire un Menu avec des portes coulissantes et des Items flottants, mais je n'arrive pas à centrer l'ensemble du Menu.
Qu'elle élément dois-je rajouter dans le script pour que cela fonctionne ?
D'avance, merci.
Piixel
Modifié par Piixel (27 Jan 2009 - 16:54)
Salut Piixel,

Si tu ne fournit aucun code, sa va être difficile à debugger ton truc... mais bon.. a froid, si t'as codé correctement, tu dois pouvoir jouer avec margin-left:auto et margin-right:auto sur l'élément qui entour ton menu (div ou ul j'en sais rien ...) attention au compatibilité avec ie mais tu trouvera tout les infos sur le sujet sur le forum Smiley cligne
Merci pour ta réponse Mikerob.
Voila mon code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Construction de menus simples en XHTML/CSS: portes
coulissantes</title>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8">
<style type="text/css"><!--
#nav {
list-style: none ;
margin: 0 ;
padding: 0 ;
overflow: hidden ;
}
#nav li {
float: left ;
width: 162px ;
border: px solid #600 ;
margin-right: 0px ;
color: #fff ;
background: #c00 ;
}
#nav li a {
display: block ;
background: #04090F url(Bouton.png) left top no-repeat ;
color: #fff ;
font: 1em "Trebuchet MS",Arial,sans-serif ;
line-height: 1em ;
padding: 7px ;
text-align: center ;
text-decoration: none ;
}
#nav li a:hover, #nav li a:focus, #nav li a:active {
background: #053C5C url(Bouton.png) right top no-repeat ;
text-decoration: underline ;
}
--></style><!--[if lt IE 7]>
<style type="text/css">
#nav { /* Contexte de formatage pour IE6 */
overflow: visible ;
height: 1% ;
}
</style>
<![endif]-->
</head>
<body>
<ul style="" id="nav">
<li><a href="#" title="info">Astuces</a></li>
<li><a href="#" title="info">Logithèque</a></li>
<li><a href="#" title="info">Accueil</a></li>
<li><a href="#" title="info">Médiathèque</a></li>
<li><a href="#" title="info">Contact</a></li>
</ul>
</body>
</html>

Que faut-il ajouter ?
ok,

donc tout en haut de ton css tu as #nav. Y faut y ajouter : 

#nav {
   list-style: none ;
   margin: 0 ;
   padding: 0 ;
   overflow: hidden ;
   /* pour center le men */
   margin-left:auto;
   margin-right:auto;
   width:820px;
}


tu est obliger de spécifier une largeur (width) parce que sinon ton menu fait toute la largeur et donc est centrer Smiley langue après tu mets la largeur que tu veux biensur.
Sujet clos
Aller à