| 6 | Selector 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 ...
Get Pragmatic Guide to Sass now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
