title: SCSS: parent hover selector
body: <p>In <code>scss</code> we can use a parent selector class:</p>
  
  <pre><code>&lt;div class="parent is-active"&gt;
    &lt;div class="children"&gt;&lt;/div&gt;
  &lt;/div&gt;
  
  .parent {
    width: 200px;
    height: 200px;
  }
  
  .children {
    height: 100px;
    width: 100px;
  
    .is-active &amp; {
      background: red;
    }
  }
  </code></pre>
  
  <p><a href="https://jsfiddle.net/wx9L9jzj/2/" rel="noreferrer">example</a></p>
  
  <p>How would you write a parent <code>hover</code> selector?</p>