title: CSS :not() Selector failure
body: <p>Recently, when I was using the CSS:not selector, I found a problem with spaces. Maybe I have a problem with the selector's understanding, please help me to answer。
  I want to select all elements except the seventh element in the main element。</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>        main:not(section:nth-child(7)){                    
              width: 100px;             
              height: 100px;
              background-color: red;
              margin: 10px;
          }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>    &lt;main&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;seven&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
      &lt;/main&gt;</code></pre>
  </div>
  </div>
  
  It is invalid after selection, but it will be valid after adding a space before the: not selector. This is the reason？</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>        main :not(section:nth-child(7)){                    
              width: 100px;             
              height: 100px;
              background-color: red;
              margin: 10px;
          }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>    &lt;main&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;seven&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
      &lt;/main&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>And I tried to select with sibling elements, but also found the space problem. Contrary to the above, adding spaces is invalid, deleting spaces is effective.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>        section :not(section:nth-child(7)){                    
              width: 100px;             
              height: 100px;
              background-color: red;
              margin: 10px;
          }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>    &lt;main&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;seven&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
      &lt;/main&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>The above code is invalid after adding a space before the not selector。</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>        section:not(section:nth-child(7)){                    
              width: 100px;             
              height: 100px;
              background-color: red;
              margin: 10px;
          }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>    &lt;main&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;seven&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
          &lt;section&gt;1&lt;/section&gt;
      &lt;/main&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>Delete: the space in front of the not selector will be effective。</p>