[Résolu] Parade au CSS mal fait

Je souhaite intégré du contenu dans une page qui utilise un .css un peu trop sévère.

Je peux ajouter mon propre fichier .css mais je n'ai pas accès à celui qui m'impose sa volontée.

Le fichier style.css contient ceci:

#html-content li {
	padding:2px 0;
}
#html-content ul {
	padding:1px 20px 8px;
}

Au lieu de définir un padding par defaut pour les LI et UL, il le force et écrase les settings qui aurait pu être définis par le user.

La zone dans laquelle j'ajoute mon contenu est bien évidement dans <div id="html-content></div>

Je souhaite ajouté un menu UL LI dans la zone de contenu.
Comme ce menu est générique et utilisé sur différents site web je ne peux pas customiser tout mon .css en fonction de #html-content.

Dans mon .css on peut trouver (entre autre):

ul.jd_menu li {float:left;text-align:left;margin:0;border-width:0;border-color:#d6b57b;border-style: solid;padding:4px 4px 4px 4px}

Je ne peux pas jouer avec !important non plus car le padding de mes LI change à différents niveaux.

Comment annuler l'effet de #html-content li ?
Modifié par Grumelo (26 Sep 2008 - 16:34)

Bonjour,
Tu n'arriveras à prendre le pas sur la CSS fautive qu'en augmentant la priorité de tes sélecteurs.

Pour plus d'infos, lire l'article suivant : Cascade CSS et priorité des sélecteurs
Bonne lecture

La solution consiste pour les lignes qui en ont besoin de systématiquement ajouter une référence à #html-content et de ne modifier QUE les propriétés écrasées par #html-content

ainsi dans mon fichier il faut écrire

ul.jd_menu li {float:left;text-align:left;margin:0;border-width:0;border-color:#d6b57b;border-style: solid;padding:4px}

#html-content ul.jd_menu li {padding:4px}

Ca évite de refaire complètement le CSS