Décaler les éléments d'une liste à puces[non résolu mais j'abandonne

Bonjour,

Je voudrais faire une liste à puces dont chaque élément li serait décalé de 20px par rapport au précédent.
Par exemple :
<ul>
<li><a href = "accueil.php">Accueil</a></li>
<li><a href = "contact.php">Contact</a></li>
<li><a href = "recommander.php">Recommander</a></li>
</ul>

Ce qui donnerait :

Accueil
Contact
Recommander

J'ai à peu près tout essayé en termes de margin et de padding : les 20px s'appliquent uniformément partout.

J'ai pensé faire une classe pour chaque li mais c'est un peu lourd
J'ai trouvé sur le web une solution en imbriquant des ul dans chaque li mais ça ne me semble pas très satisfaisant du point de vue de la logique.

Bref, quelqu'un aurait-il une solution ?

Merci d'avance

Stéphane
Modifié par fanucho (03 Nov 2005 - 10:41)

Je reprécise ce que ça doit donner :

Contact est 20px plus à droite que Accueil et Recommander est 20px plus à droite que contact (soit 40 px plus à droite qu'accueil)

Bonjour,

Pour une meilleur compréhension du code que tu copies/colles il est préférable voire indispensable que tu suives les instructions de la FAQ. Place le dans le BBcode "Code".

Sinon pour ta question je serai tenté de mettre le padding-right:20px et un float:left sur le a ainsi que la propriété display:inline sur ton li. Qu'en penses-tu ?

Un p'ti lien aussi c'est pas mal pour juger du problème sur pièce (cf. FAQ)

Bonjour zzzazzz,

J'ai essayé ce que tu m'as dit mais ça ne marche pas. Il faut dire que j'avais oublié de préciser que je voulais que les différents éléments <li> soient décalés mais aussi les uns en dessous des autres. Pour ça, je ne pense pas que display: inline soit une bonne idée.
Cela étant dit, j'ai décidé de changer ma mise en page. Donc, la question n'est pas résolue mais ce n'est pas grave, je laisse tomber.
Merci beaucoup en tout cas pour ton aide

Bonjour zzzazzz,

J'ai essayé ce que tu m'as dit mais ça ne marche pas. Il faut dire que j'avais oublié de préciser que je voulais que les différents éléments <li> soient décalés mais aussi les uns en dessous des autres. Pour ça, je ne pense pas que display: inline soit une bonne idée.
Cela étant dit, j'ai décidé de changer ma mise en page. Donc, la question n'est pas résolue mais ce n'est pas grave, je laisse tomber.
Merci beaucoup en tout cas pour ton aide

bonjour,

la réponse générale est de bon sens : si tu veux un comportement spécifique pour chaque item d'une liste alors il faut que tu particularise chacun de ces items par une class ou un id