Remember nesting in HTML? The thing we do all the time when we put a <p> in a <div> and a <span> in the <p> like this?
...
For further actions, you may consider blocking this person and/or reporting abuse
Great tutorial, I like that you've also made a caution about the excessive nesting.
In my work I avoid styling elements by
#id
's. Usually I use them only as anchors.Also a quick note about naming. For example you've used
.sidebar-list-link
.I prefer to avoid this kind of "nesting" in naming as well and use only one level of nesting. So I would do
.sidebar
and.sidebar-list
. And.list
maybe with.for-sidebar
modifier with.list-link
. Basically I would follow a bit modified version of BEM methodology.Thanks for the addition. 😊😊
Great article! Another use for the ampersand that people might find useful would be to reference parent selectors with the ampersand at the end.
Very powerful!
Awesome!!! Thanks for sharing this Lynne.
Great tutorial. A fantastic tip on this:
Never thought about doing that.
Thank you😊
Well explained.
Just an addition: I've been using stylelint and stylelint-config-sass-guidelines to keep my SASS files in check and you can also configure it to set a maximum nesting depth.
That's awesome. I'll look at them. Thanks for sharing.
what does the
&
do when it is before or after a nestedclass
orid
??Nesting with SASS does not seem to work for me? banishing negativity spells
Should you nest everything in SASS? comment rendre un homme amoureux