Discussion :

[nixonne]

Bonjour,

J'aimerai savoir si il est possible en CSS de mettre un background sur un li en incluant la puce.

Merci d'avance

Nixonne

[cssman]

Bien sûr http://plambert.developpez.com/css-d...=page_7#LVII-B
Avec une petite amélioration : il vaut mieux utiliser les em plutôt que les % pour positionner les puces.

[nixonne]

SAlut,

En fait voici ce que je veux faire : avec la flèche en image de puce

Est-ce faisable car avec le lien que tu m'as donné, le background ne commence qu'au niveau du texte (même si ce n'est pas avec des <li>).

Merci d'avance

Nixonne

[cssman]

Je ne comprends pas bien ton interrogation...
N'importe quel élément peut être précédé d'une image, que ce soit un <li>, un <p> ou autre chose.

Pourrais-tu donner ton code ?

[Bovino]

+1 cssman.
Il est même possible de définir des puces perso (list-style-image) pour les listes...

[nixonne]

Bonjour,

Voici ce que je voudrai faire :

et voici ce que j'obtiens

avec ce code html

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<ul>
                    	<li>E-Commerce</li>
                    	<li>E-Commerce</li>
                        </ul>

et ce code CSS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
.LeftMenu li{
font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;
  font-size: 100%;
  color: black;
  list-style-image:url("images/fleche.jpg");
  background-position:0% 65%;
  padding-left:0px;
  margin-bottom:5px;
  background-image:url("images/LeftMenu-h2.jpg");
  background-repeat:repeat-y;
  color:#ffffff;
  margin-left:0px;
}

J'espere que je suis plus clair maintenant.

Merci en tout cas de votre aide

Nixonne

[cssman]

Ah d'accord !
Rajoute

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

list-style-position:inside;

[nixonne]

Merci beaucoup, c'est tout a fait ce que je voulais faire.

Je clos donc ce post