[CSS] Améliorer le style des listes à puces

le Ven Mar 26, 2004 17:48

Bonjour,
J'ai remarqué qu'il y a souvent un interligne trop grand qui précède mes listes à puces.
Il m'arrive d'écrire du code de ce type :

Code: Tout sélectionner: <p>Voici un exemple :</p> <ul> <li>ligne1</li> <li>ligne2</li> <li>...</li> <li>ligneN</li> </ul>

Je ne sais pas si c'est bien comme ça qu'il est prévu d'utiliser les 3 balises p, ul et li.
J'imagine qu'il est possible de personnaliser l'affichage en utilisant les CSS mais je ne m'y connais pas assez.

Si quelqu'un a une idée... je suis preneur !

le Ven Mar 26, 2004 18:26

Joue sur le margin et le padding.

Fred

le Ven Mar 26, 2004 18:31

Bonjour,

Tu peux modifier l'espace entre un paragraphe et la liste avec une feuille de style.
Dans l'en-tête (entre les balises <head></head>)

Code: Tout sélectionner: <style type="text/css"> .interligne { margin-bottom: -15px; } </style>

et dans le code de ta page

Code: Tout sélectionner: <p class="interligne">Le texte</p> <ul> <li>un</li> <li>deux</li> </ul>

A toi de donner la valeur qui te convient à margin-bottom (la marge du bas)

Amicalement,
Monique

le Ven Mar 26, 2004 19:29

Génial Monique !

Je dois mettre du CSS partout sur mon site... je t'embauche :lol:

le Ven Mar 26, 2004 21:07

vu que les padding, margin et compagnie sont interpretes de maniere tres differentes suivant le navigateur, je me suis resolu a une solution simple mais ô combien efficace:

utiliser le selecteur universel pour mettre tous les padding et magin de toutes les balises de toutes les pages, a 0

* {
padding:0;
margin:0;
}

ensuite, tu n'as plus qu'à mettre du padding / margin la ou ca t'interresse, et uniquement la!!!

[CSS] Améliorer le style des listes à puces

[CSS] Améliorer le style des listes à puces

Formation recommandée sur ce thème :

Lectures recommandées sur ce thème :

Qui est en ligne