Fusion de classes CSS

Question

Quelqu'un peut-il faire la lumière sur ce problème? Le résultat attendu ne semble PAS se produire ... Suis-je correct dans mes hypothèses?

.float-right{ 
    float:right; 
} 

.header{ 
    (stuff we don't care about) 
} 

.header img .float-right { 
    display:inline; 
    margin:0 0 0 0.5em; 
} 

Je PENSEE qui signifierait qu'une < img> dans un < div class = "tête"> obtiendrait:

float:right; 
display:inline; 
margin:0 0 0 0.5em; 

IF le < img> classe était = "float-right"

Est-ce correct?

Answer 1

Pour obtenir le résultat que vous voulez, il devrait être

.header img.float-right 

(pas d'espace)

Answer 2

No. .header img .float-right signifie toute étiquette avec la classe de flotteur droit qui est un descendant d'une balise img qui est à son tour le descendant d'une étiquette avec la classe d'en-tête.

Answer 3

SI le < img> a class = "float droite"

Pour réaliser qu'il ne devrait y avoir aucun espace

.header img.float-right { 

Comme il est maintenant, il cherche

[an element with class "float-right"] [inside an img] [inside an element with class header] 

Answer 4

C'est ce qui se passera si vous supprimez l'espace entre img et .float droite dans votre feuille de style.