- Nesting:
.anElement {
&_aBlock {
…
}
&_anotherBlock {
…
}
&_anotherBlockAgain {
&:hover {
…
}
}
}
- Limiting Nesting to Pseudo Elements:
.anElement {
…
}
.anElement_aBlock {
…
}
.anElement_anotherBlock {
…
}
.anElement_anotherBlockAgain {
&:hover {
…
}
}
I'm not strongly for or against, but I like that nesting gives you one instance of
anElement
in the SCSS. It feels safer from typos and easier to refactor.