O'Reilly logo

Pragmatic Guide to Sass by Michael Lintorn Catlin, Hampton Catlin

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

6Selector Scoping

Let’s look at a core feature of Sass: nesting. 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 versus a standalone em selector. It gives you more freedom with reusing names and making your HTML more semantic and readable. We generally refer to this as scoping.

It’s a good thing to scope, except it’s not DRY. (Remember Don’t Repeat Yourself?). We keep having to repeat our classes or IDs—for example, repeating an apply-to-all class like .infobox—on every line. Typing this by hand is laborious and makes us want to be lazy. When writing CSS, scoping can be very tedious. It involves ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required