Bonjour , j'ai un problème avec le tuto sur l'incrustation du design . Mon menu est complètement a gauche :

Voici mon code "style.css"

body {
    background:url(images/background.png) no-repeat top center #000000;
    margin:0;
    padding:0;
    font-family:Verdana, Geneva, sans-serif;
    font-size:9px;
}
#header {
    height:190px;
    background:url(images/top.png) no-repeat top center;
}
#conteneur {
    width:894px;
    margin:0 auto;
}
#menu {
    background:url(images/contenu.png) repeat-y bottom center;
    height:55px;
}
#menu ul li {
    list-style:none;
    float:left;

}
#menu ul li a {
    height:45px;
    width:107px;
    font-size:18px;
    text-decoration:none;
    text-align:center;
    background:url(images/bouton.png) no-repeat top right;
    display:block;
    line-height:40px;
    color:#FFFFFF;
}
#menu ul li a:hover {
    background-position:bottom left;
}

Merci d'avance .

5 réponses


Sebounet
Réponse acceptée

Tiens sur ce site http://contrib.linalis.com/content/css-un-menu-horizontal-centre-sans-utiliser-les-flottants on parle du display:inline-block. Cela devrait t'aider pour centrer ton menu horizontale.

Teckchz
Réponse acceptée

/* Il faut ici rajouter une class */

menu_horizontal li {

display : inline;
padding : 0 0.5em; /* Pour espacer les boutons entre eux */
}
ul#menu_horizontal {
list-style-type : none; /* Car sinon les puces se placent n'importe où */
}
Et normalement ton menu se placera au milieu.

#menu ul li a:hover {  
    background-position:bottom left;  
}

C'pas:

#menu ul li a:hover {  
    background-position:center;  
}
Pillgrim
Auteur

Euh , non désolé ça marche pas :(

Va voir du côté d' Alsacréations.