[CSS] Liste à puces et séparateurs en inline

Bonjour,
j'ai créé une liste à puces (<ul><li>El1</li><li>El2</li></ul>) et je l'ai mise en display:inline.

Du coup, j'obtiens : El1 El2 et il n'y plus les puces
Est-ce possible de fixer des puces en mode inline ? ou par exemple un - ou | de séparation entre les elements de la liste ?


Merci d'avance

http://www.developpez.net/forums/viewtopic.php?t=400294

lui il utilise des lien en block non ? moi j'aimerais simplement un caractère de séparation entre chaque <li>. j'ai essayé :
ul
{
list-style-type:square;
}

marche pas non plus

tu peux montrer ton code stp ?

html :

Code:

---

1 2 3 4 5 6 7 8 9

<div id="div_menu"> <ul> <li>Profil</li> <li>Messages privés</li> <li>Accueil du forum / site</li> <li>Liste des membres</li> <li>A propos</li> </ul> </div>

---

CSS:

Code:

---

1 2 3 4 5 6

#div_menu li { display:inline; list-style-type:square;   }

---

Salut,

Je ne vois pas trop l'utilité d'utiliser une liste à puce horizontale en display inline, les <span> seraient plus appropriés à mon goût, mais bon peut-être que tu as une idée bien précise de ce que tu veux faire.

J'ai deux solutions soit tu intègres une puce en image, du genre :

Code:

---

1 2 3 4 5 6 7

#div_menu li{ display: inline; margin: 0 10px 0 0; padding-left: 15px; /* largeur de ton image */ background: #fff url(tonImage.gif) no-repeat; }

---

Ou alors si une image ne te convient pas, les caractères spéciaux pourraient faire l'affaire :

Code:

---

1 2 3 4 5 6 7 8 9 10

<div id="div_menu"> <ul> <li>&bull;&nbsp;Profil</li> <li>&raquo;&nbsp;Messages privés</li> <li>&curren;&nbsp;Accueil du forum / site</li> <li>&ndash;&nbsp;Liste des membres</li> <li>&rsaquo;&nbsp;A propos</li> </ul> </div>

---

A part ça, je ne vois rien d'autre.

ok merci ça marche bien avec la première méthode ;)

thx :D