Centrer une puce au texte

totof

21 Mar 2006 à 03:07

Bonjour à tous etun grand merci à Raphaël Goetter qui m'a permis de creer mon 1er site respectant le CSS2.

Donc voilà ,j'ai voulu creer un menu avec des listes personalisées mais je n'arrive pas à centrer le texte par rapport aux images?. Comment peut t-on le faire ?

<ul>
<li id="perso1">Menu1</li>
<li id="perso2">Menu2</li>
</ul>

#menu ul, li {
margin:0;
padding:0;
}

#menu li {
list-style:none;
}

#menu li#perso1 {
list-style-image:url(monimage1.png);
}

#menu li#perso2 {
list-style-image:url(monimage2.png);
}

Stephan

21 Mar 2006 à 05:23

Bonjour

Pour obtenir des puces centrées au pixel près, tu vas devoir changer de méthode.

Par exemple :


#perso { 
   list-style-type: none; 
   background: url(images/diamond.gif) center left no-repeat; 
   padding: 0 0 0 18px; 
}

Au passage, est-ce que tu pourrais baliser ton code avec le BBCode [ code][/code ] (sans les espaces) tel que demandé dans les règles du forum* ?

Ça le rendra plus lisible.

Merci, et bienvenue sur ce forum Smiley cligne

--
* que tu as lues et approuvées en t'inscrivant.

totof

21 Mar 2006 à 07:23

merci,
j'ai appliqué ta methode mais voici le rendu que ça me donne "mon image fais 32x32px "

et j'ai utilisé une autre methode ça à l'air de fonctionner :


   line-height:32px;
   height:32px
   list-style-type: none; 
   background: url(images/ajouter.png) center left no-repeat; 
   padding: 0 0 0 50px;

le resultat:

C'est normal que ça marche ainsi ? Smiley rolleyes

totof

21 Mar 2006 à 07:52

Au fait par la meme occasion je voudrais savoir comment centrer une image <img /> par rapport à une balise h1 ?