Pourquoi mon CSS color ne fonctionne pas ?
Bonjour,
Quelqu'un peut m'expliquer quelle serait la raison pour laquelle mon CSS color ne s'applique pas sur mon texte avec un lien alors que c'est bien la bonne couleur dans mon style.
HTML :
<p class="défensecollective-1 has-text-color" id="défense-collective-des-droits-sociaux" style="color:#0000ff;font-size:25px">
<a href="https://gidds.org/defense-collective-des-droits-sociaux/" data-type="page" data-id="10375">DÉFENSE COLLECTIVE DES DROITS SOCIAUX</a>
</p>
CSS:
J'ai essayé ceci :
a:link {
color: #0000FF;
}
et ceci :
.défensecollective-1 {
color: #0000FF;
text-decoration: underline;
}
ça fonctionne en prévisualisation mais quand je vais sur le site ça reste noir. Vous avez des pistes ? J'utilise le thème Canvas dans Wordpress.
Votre code CSS ne fonctionne pas car une autre règle CSS prend le dessus sur celle que vous avez ajouté.
Pour identifier la règle en question vous pouvez utiliser l'inspecteur de code intégré à votre navigateur internet (touche F12). Avec Google Chrome effectuez un clic droit sur le lien et cliquez sur Inspecter.
Il existe également la règle CSS !important qui comme son nom l'indique permet de donner plus d'importance à une propriété ou une valeur CSS :
a:link {
color: #0000FF !important;
}
Par ailleurs c'est toujours la règle CSS appliquée à la balise HTML la plus proche de l'élément qui est prioritaire. Ainsi l'ajout par exemple d'une balise <span> autour du texte peut résoudre votre problème :
<p class="has-text-color" id="défense-collective-des-droits-sociaux" style="font-size:25px">
<a href="https://gidds.org/defense-collective-des-droits-sociaux/" data-type="page" data-id="10375"><span class="défensecollective-1">DÉFENSE COLLECTIVE DES DROITS SOCIAUX</span></a>
</p>