 <p>Why not simple:</p> <pre><code>.a { color: red; } .b { color: blue; } .c { color: yellow; } </code></pre> <p>The difference between those two is that first one covers all six types:</p> <pre><code>.one .a, .one .b, .one .c, .two .a, .two .b, .two .c </code></pre> <p>While the second one only covers 4:</p> <pre><code>.one .a, .one .b, .two .a, .two .c </code></pre> <p>With respect to your markup - no difference at all, except that the very first case (without <code>.one</code> and <code>.two</code>) will be sliiiiiightly faster.</p> <p>Also, see <a href="http://www.css-101.org/descendant-selector/go_fetch_yourself.php">this</a>.</p>