Puces de mes listes [Résolu]

[dodo69]

Bonjour a tous,

Je commence juste le css et html , et je me trouve confronté à un problème

J'ai ce code dans mon fichier css:

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
.puceronde {
list-style-type: circle;
}
 
.numlettre{
list-style: upper-alpha;
color: gray;
}
 
.puceimg{
list-style-image: url("http://www.moulindelagalette.fr/clientuploads/Icones/Puces_Word/Puce_Fleche_15.jpg");
font-weight: bold;	
}

et dans mon fichier texte celui ci

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
 
<ul class="puceimg">
<li> <b>lundi</b> 
	<ul class="puceronde">
	<li> Salade Verte </li>
	<li> Hachis Parmentier</li>
	</ul>
</li>
 
<li> <b>Mardi</b>
	<ul class="puceronde">
	<li> Salade niçoise </li>
	<li> Paella aux fruits de mer</li>
	</ul>
</li>
<li> <b>Mercredi</b>
	<ul class="puceronde">
	<li> Salade Tomate-Mozarella </li>
	<li> Gnocchis </li>
	</ul>
</li>
 
<li> <b>Jeudi</b>
	<ul class="puceronde">
	<li> Brochette de Colin</li>
	<li> Riz créole </li>
	</ul>
</li>
 
<li><b> Vendredi</b>
	<ul class="puceronde">
	<li> Salade au choix </li>
	<li> Couscous à la viande d'agneau </li>
	</ul>
</li>
</ul>

J'aimerai avoir les fleche comme puce pour les jours de la semaine ...
et des cercle pour les menus,
or avec ce code, je n'obtien que des flèche
est-ce normal ?
comment y remedier?

Merci d'avance
Cordialement
Dorian rapoud

[bob633]

Les puces se mettent sur des balises li, pas sur les ul à mon avis ...

Si tu n'as que des fléches c'est surement parce que par défaut ce sont des fléches qui s'affichent donc ne prend en compte aucun de ton code.

A confirmer quand même pour les balises ul, sinon tu mets une petite image devant ton titre si c'est pas bon.

[dodo69]

Merci pour ta proposition bob,

La meilleur solution que j'ai trouver pour empecher que les puce image prenne le dessus c'est ça :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
.puceronde {
list-style-image:none;
list-style-type: circle;
}
 
.numlettre{
list-style: upper-alpha;
color: gray;
}
 
.puceimg{
list-style-image: url("http://www.moulindelagalette.fr/clientuploads/Icones/Puces_Word/Puce_Fleche_15.jpg");
font-weight: bold;	
}