Pragmatic Guide to Sass 3

2	Scoping Selectors with Nesting

One of the first features incorporated into Sass was the ability to nest selectors. If you’ve been working with CSS for a long time, you know the advantages of giving more specific selectors to your style sheets. Using .sidebar p em allows you greater specificity to the em element vs. a stand-alone em selector. It gives you more freedom with reusing names and making your HTML more semantic and readable. This is called scoping.

It’s a good thing to scope, except it’s repetitive. We have to repeat our classes or IDs. In the example on the next page, an apply-to-all class like .infobox is repeated—on every line. Typing this by hand is laborious and makes you want to streamline the process, doesn’t it? When writing ...