Discussion :

[laurentSc]

Bonjour,
j'ai indiqué dans mon CSS une couleur de fond jaune et pourtant elle est verte. Comment se fait-ce ?

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<div class="divtable-cell-150 fond-colore-yellow">unactive license</div>

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
.divtable-cell-150 {
    display:table-cell;
    padding:6px;
    width:150px;
}
.fond-colore-yellow{
    background-color:yellow;
    color:white;
}

[NoSmoking]

Bonjour,
aucune raison sauf si :

• le cache n'est pas vidé ;
• un sélecteur autre à plus de poids ;
• et peut être !!!

[laurentSc]

Pour être sûr d'éliminer le problème du cache, j'ai rebooté le PC.

Pour la question du poids des sélecteurs, existe-t-il un outil pour faire le calcul ?

[Doksuri]

clique-droit sur l'element > inspecter l'element
=> dans la console, ca t'as ouvert l'onglet "elements" > dans la colonne de droite : t'as l'onglet "style"
==> ca te liste tous les styles appliques a l'element (et qui ecrase quoi)

[laurentSc]

==> ca te liste tous les styles appliques a l'element (et qui ecrase quoi)

J'ai suivi tes indications. Mon navigateur est Google Chrome. J'ai bien les 2 onglets "éléments" et "style". Il y a bien la liste des styles appliqués (dont

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
.fond-colore-yellow {
    background-color: yellow;
    color: white;
}

(avec un carré vert en face de background-color: yellow;). Il y a certaines règles barrées ; comme

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
div {
    display: block;
}

mais déjà, pas background-color: yellow;, et en plus aucune indication de qui l'a écrasée...

[NoSmoking]

Pour être sûr d'éliminer le problème du cache, j'ai rebooté le PC.

Un Ctrl + F5 est suffisant.

existe-t-il un outil pour faire le calcul ?

fait une recherche avec ton moteur de recherches préféré avec comme mots clé : « CSS Specificity Calculator »

(avec un carré vert en face de background-color: yellow;).

ne serait ce pas yellowgreen alors ? sinon il nous faudrait le contexte.

Essaie en mettant simplement #FF0 à la place de yellow.