pb alignement block

omzen

Membre confirmé
26 Septembre 2008
88
6
45
Nice
www.coeuraccords.net
bonsoir à tous et à toutes

mon menu horizontal ne se centre pas avec le block central malgré le "margin: auto;" j'ai beau changé des choses, rien n'y fait.
la tête dans le guidon de mon niveau débutant, je ne trouve pas d'issue à mon dilemme.

En auriez-vous un, vous ?
page en question http://www.coeuraccords.com/CLCA/pages/accueil.html
(merci pour ceux qui veulent/peuvent bien m'aider)

code du block central :
Bloc de code:
div.centre {
    width: 860px;
    background: #EAF2F5;
    margin: auto;
      margin-bottom: 10px;
    text-align: left;
    padding: 1px;
}
code du menu :
Bloc de code:
#menu {
    width: 850px;
    height : 30px;
    position: relative;
    margin: auto;
    list-style : none;
    line-height : 30px; /* définit une hauteur pour chaque élément */
    font-family : Arial;
    font-size : 14px; /* hauteur du texte : 12 pixels */    
    z-index: 20;
}#menu ul { /* Liste */     
    padding : 0; /* pas de marge intérieure */
    margin : 0; /* ni extérieure */
    list-style : none;
    line-height : 25px; /* définit une hauteur pour chaque élément */
}#menu a { /* Contenu des listes */
    display : block; /* Les liens deviennent des balises de type block */
    padding : 0;
    color : #013082; /* couleur du texte */
    background    : #EAF2F5 ;
    border: 1px solid white;
    text-decoration : none;
}#menu li { /* Éléments des listes */      
    float : left;
    width : 120px;
    background: #EAF2F5;
    text-align:center
}#menu li ul { /* Sous-listes */
    position: absolute;
    width: 120px;
    left: -999em;
    z-index: 30;
}#menu ul li { /* Éléments des listes */      
    float : left;
    width : 120px;
    background: #EAF2F5;
    text-align:center
}#menu ul li ul { /* Sous-listes */
    position: absolute;
    width: 120px;
    left: -2em;
    z-index: 30;
}#menu ul li { /* (Sous-liste de Sous-listes) Éléments des listes */ 
    float:left; 
    margin-right:172px; 
    position:relative;
}#menu ul li ul li{ /* Sous-liste des Sous-listes */
    position:relative;
    margin-top: -1px;
    z-index:50;
}#menu li ul ul {
    margin: -20px 0 0 120px;
}#menu a:hover { /* Lorsque la souris passe sur un des liens */    
    color: black; /* On passe le texte en blanc... */
    background: #FFC0CB;
    font-weight : bold; /* texte en gras */
}#menu li:hover ul ul, #menu li.sfhover ul ul {
    left: -999em;
}#menu li:hover ul, #menu li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul {
    left: auto;
    min-height: 0;
}
 
Tu mélanges pas mal de choses, pourquoi ne pas englober tes contenants dans un container global qui fait ton travail de centrage ?

Ton ul est toute seule, revoit les styles en conséquence :

Bloc de code:
#menu {
	width: 850px;
	height : 30px;
	position: relative;
	margin-left: auto;
	margin-fight: auto;
	list-style : none;
	font-family : Arial;
	font-size : 14px;	
	z-index: 20; 
	padding: 0px; 
	list-style : none;
	line-height : 25px; 
}
:p