The problem with those rules is the second you want to reuse your .quote class in your new .wrapper2 layout you are in for some refactor hell. In addition your

The problem with those rules is the second you want to reuse your .quote class in your new .wrapper2 layout you are in for some refactor hell. In addition your specificity levels are getting pretty wonky, simple things like media queries would require duplicating the exact same nesting structure. Another issue which could effect code like this is ui performance, see this deck for more info https://speakerdeck.com/jonrohan/githubs-css-performance https://speakerdeck.com/jonrohan/githubs-css-performance. Many sites won't need to worry about this last point. Every modern CSS codebase attempts to use 1 location agnostic class per element. Usually when warning against 3 levels of nesting in preprocessors it is to maintain readability on pseudo selectors but not an encouragement to nest classes.