Concaténation des sélecteurs en SASS
Parfois, nous avons besoin que lors de la compilation des constructions imbriquées, elles se concatènent de manière collée, et non pas par un espace. Pour cela, il faut placer une esperluette devant le nom du sélecteur imbriqué :
div {
&.block {
width: 300px;
}
}
En conséquence, après la compilation, nous obtiendrons le code suivant :
div.block {
width: 300px;
}
Dites quel sera le résultat de la compilation du code suivant :
#block {
&.xxx {
width: 300px;
}
}
Dites quel sera le résultat de la compilation du code suivant :
#block {
.xxx {
width: 300px;
}
}
Dites quel sera le résultat de la compilation du code suivant :
#block {
&.xxx {
&.zzz {
width: 300px;
}
}
}
Dites quel sera le résultat de la compilation du code suivant :
#block {
&.xxx {
.zzz {
width: 300px;
}
}
}
Dites quel sera le résultat de la compilation du code suivant :
#block {
.xxx {
&.zzz {
width: 300px;
}
}
}
