Un style qui ne s'applique pas

[cheloniologue]

Bonjour,

J'ai un soucis avec un style qui ne s'applique pas ...

.Style13 a{
font-weight: bold;
font-style: italic;
color: #00CC00;
}

<p class="Style13"><a href="Testudohorsfieldii.php">- Agrionemys horsfieldii</a> </p>

Il y a un conflit entre

principal
a {
color: #993300;
}

a.Style13 {
color: #00CC00;
font-size: 12px;
font-style: italic;
font-weight: bold;

Sur la page http://www.cheloniophilie.com/Photos/

Pouvez vous m'aider ?

[Ernestine]

Salut,

En CSS, la définition sur les id est prioritaire de celle sur les class, ce qui explique que les propriétés de #contenu-principal a sont prioritaires sur .Style13 a

Pour résoudre le problème, je pense qu'il suffirait de mieux cibler l'élément, remplacer :

.Style13 a {
	font-weight: bold;
	font-style: italic;
	color: #00CC00;
}

par :

#contenu-principal .Style13 a {
	font-weight: bold;
	font-style: italic;
	color: #00CC00;
}

[Dadou]

Évite d'utiliser une classe aussi générique créé automatiquement par dreamweaver, en plus, tu devrais dans ce cas utiliser des listes non ordonnées, c'est à dire :

Remplace

<h2>Les tortues terrestres</h2>
                  <p class="Style13"><a href="Testudohorsfieldii.php">- Agrionemys horsfieldii</a> </p>
                  <p class="Style13"><a href="Astrochelysradiata.php">- Astrochelys radiata</a></p>
                  <p class="Style13"><a href="Astrochelys-yniphora.php">- Astrochelys yniphora </a></p>
                  <p class="Style13"><a href="Centrochelys_sulcata.php">- Centrochelys sulcata</a></p>
                  <p class="Style13"><a href="Chelonoidis-carbonaria.php">- Chelonoidis carbonaria </a></p>

par

<h2>Les tortues terrestres</h2>
<ul>
                  <li><a href="Testudohorsfieldii.php">Agrionemys horsfieldii</a> </li>
                  <li><a href="Astrochelysradiata.php">Astrochelys radiata</a></li>
                  <li><a href="Astrochelys-yniphora.php">Astrochelys yniphora </a></li>
                  <li><a href="Centrochelys_sulcata.php">Centrochelys sulcata</a></li>
                  <li><a href="Chelonoidis-carbonaria.php">Chelonoidis carbonaria </a></li></ul>

et dans le CSS

#contenu-principal ul li a {

        font-weight: bold;
        font-style: italic;
        color: #00CC00!important;
}

Et le !important sur le color devrait solutionner ton probleme

[cheloniologue]

Merci pour vos réponses ...

Par contre Dadou, ta technique est pratique si je veux que des li d'une seule couleur ... en l'occurrence sur la page ... j'ai 4 styles ... d'ou l'important de passer par un style et non li ... à moins que l'on puisse paramétrer 4 li ?

[Dadou]

Tu met la classe sur le ul :

<ul class="tortue_marine">...

et le css

#contenu-principal ul.tortue_marine li a {
color: #0C0!important;
}

[cheloniologue]

Ok je viens de comprendre ... dis donc dis donc ... j'en apprends des choses !!! :cool:

Tu dis que les <li> c'est mieux que les <p>... ça fait d'avantage liste si je comprends bien !!

Bon ben je vais faire l'ajustement alors

[Dadou]

bah li c'est liste justement, et dans le css en mettant list-style: disc; les puces se font toutes seules, pas besoin de mettre -

[captain_torche]

Tu dis que les <li> c'est mieux que les <p>...

Attention aux contresens, toutefois : les <li> sont meilleurs que les <p> ... dans ce contexte : une suite (d'où la liste) de liens.

Il faut bien garder en mémoire qu'il faut utiliser la balise appropriée en fonction du contexte : p pour un paragraphe, blockquote pour une citation, etc.