 <p>After @abhitalks comments/feedback. In your first example is nothing wrong, just is related to only inherited properties which will not work. color is inherited, but border is not:</p> <p>Take a look here <a href="http://www.w3.org/TR/CSS21/propidx.html" rel="nofollow"><strong>Full property table</strong></a></p> <p><div class="snippet" data-lang="js" data-hide="false"> <div class="snippet-code"> <pre class="snippet-code-css lang-css prettyprint-override"><code>:not(p) { color: #f00; border: 1px solid gray; }</code></pre> <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;h1&gt;This is a heading&lt;/h1&gt; &lt;p class="example"&gt;This is a paragraph.&lt;/p&gt; &lt;p&gt;This is another paragraph.&lt;/p&gt; &lt;div&gt;This is some text in a div element.&lt;/div&gt;</code></pre> </div> </div> </p> <p>In you second example:</p> <blockquote> <p>Selectors level 3 does not allow anything more than a single <a href="http://www.w3.org/TR/css3-selectors/#simple-selectors" rel="nofollow">simple selector</a> within a :not() pseudo-class.</p> </blockquote> <p>You can change it to:</p> <p><div class="snippet" data-lang="js" data-hide="false"> <div class="snippet-code"> <pre class="snippet-code-css lang-css prettyprint-override"><code>body :not(.example) { color: #ff0000; }</code></pre> <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;h1&gt;This is a heading&lt;/h1&gt; &lt;p class="example"&gt;This is a paragraph.&lt;/p&gt; &lt;p&gt;This is another paragraph.&lt;/p&gt; &lt;div&gt;This is some text in a div element.&lt;/div&gt;</code></pre> </div> </div> </p>