title: Sass ampersand, select immmediate parent?
body: <p>Is there a way in Sass to use the ampersand to select the immediate parent, rather than the parent selector of the entire group? For example:</p>
  
  <pre><code>.wrapper{
      background-color: $colour_nav_bg;
      h1{
          color: $colour_inactive;
          .active &amp;{
              color: red;
          }
      }
  }
  </code></pre>
  
  <p>compiles to:</p>
  
  <pre><code>.wrapper h1{
      color: grey;
  }
  
  .active .wrapper h1{
      color: red
  }
  </code></pre>
  
  <p>but what I actually want is:</p>
  
  <pre><code>.wrapper .active h1{
      color: red;
  }
  </code></pre>
  
  <p>Is the only option to write the SCSS like so?</p>
  
  <pre><code>.wrapper{
      background-color: $colour_nav_bg;
      h1{
          color: $colour_inactive;
      }
      .active h1{
          color: red;
      }
  }
  </code></pre>
  
  <p>The HTML looks like this:</p>
  
  <pre><code>&lt;ul class="wrapper"&gt;
      &lt;li class="active"&gt;
          &lt;h1&gt;blah&lt;/h1&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>