title: select grandparent in css
body: <p>i have an html code like this</p>
  
  <pre><code>&lt;div class="main-container"&gt;
     &lt;div class="main"&gt;
       &lt;div class="col-main"&gt;
          &lt;div class="category-products"&gt;
             &lt;div class="toolbar"&gt; &lt;/div&gt;
          &lt;/div&gt;
       &lt;/div&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>i've tried to change the <strong>main-container</strong> background if it has toolbar descendant, ive tried like this :</p>
  
  <pre><code> .main-container &gt; .main .col-main .category-products .toolbar{
    background-color: #f5f5f5;
    padding-top: 0;
  }
  
  .main-container &gt;  .toolbar{
    background-color: #f5f5f5;
    padding-top: 0;
  }
  </code></pre>
  
  <p>but nothing works</p>