Listes de définitions : pb de marges [Résolu]

bonjour à tous

voilà mon problème. j'ai un div #contenu qui contient le contenu de ma page perso. ds cette page j'aimerais utiliser des listes de définitions, avec une marge bas de 1em pour chaque <dd>, histoire de pas faire trop serré.

J'ai donc ce code

#contenu dl{
margin : 0;
}
	
#contenu dd {
margin : 0 0 1em 0;
}

Mais pour deux listes en particuliers, j'aimerais ne mettre aucune marge entre chaque <dd>. J'ai donc créer une classe (appelons-là "autre_liste")

.autre_liste dd{
margin : 0;
}

Côté HTML, j'ai ce code :

<dl class="autre_liste">
  <dd>liste 11</dd>
  <dd>liste 12</dd>
  <dd>liste </dd>
</dl>

<dl class="autre_liste">
  <dd>liste 21</dd>
  <dd>liste 22</dd>
</dl>

Mais rien à faire, j'ai toujours cette marge de 1em entre chaque <dd>.
Et chose bizarre, si je remplace "class" par "id" et que je change le signe ds la CSS ('.' au lieu de '#'), ca fonctionne bien. Mais j'ai deux listes avec le même ID, ce qui n'est pas correct...
Comment faire?

Merci de votre aide
Modifié par hollywood57 (15 Dec 2005 - 18:55)

Bonjour hollywood57 et bienvenue sur ce forum.

Tu dois augmenter la spécificité de ton sélecteur :

dl.autre_liste dd {
   margin: 0;
}

ou

body dl.autre_liste dd {
   margin: 0;
}

ou

dl.autre_liste dd {
   margin: 0 !important;
}

Lire : Cascade CSS et priorité des sélecteurs

merci, c'est nickel

C'est donc [Résolu] ?

Stephan a écrit :
C'est donc [Résolu] ?

yes! j'apprends