Mastering CSS

BEM

One technique for keeping specificity low is avoiding descendant selectors altogether using BEM. BEM stands for Block Element Modifier and is a naming convention for CSS. The idea is to use a specific naming convention to add a class to every element you are eventually going to style. This way every element has a specificity score of 10, thus every element has the same specificity. There's a lot more to it that just that, and I recommend checking it out at http://getbem.com/ to learn more about it. I tend to use the BEM methodology, but that's not to say descendant selectors need to be completely avoided. I think there's a time and place for them. My suggestion is keep your descendant selectors reasonable and avoid longer descendant selectors ...