title: Prevent nesting in SCSS/SASS output
body: <p>With all the neat features in SCSS, it can be easy to get carried away and end up with some pretty rough CSS.</p>
  
  <p>Take, for example, a classic nested rats nest -</p>
  
  <pre><code>.image {
      ...
  
      .imageWrapper {
          ...
  
          img {
              ...
          }
      }
  
      .textWrapper {
          ...
  
          title {
              ...
          }
  
          caption {
              ...
          }
      }
  }
  </code></pre>
  
  <p>Which compiles to</p>
  
  <pre><code>.image {
      ...
  }
  
  .image .imageWrapper {
      ...
  }
  
  .image .imageWrapper img {
      ...
  }
  
  .image .textWrapper {
      ...
  }
  
  .image .textWrapper .title {
      ...
  }
  
  .image .textWrapper .caption {
      ...
  }
  </code></pre>
  
  <p>This is not only hard to read, but a slog on processors.</p>
  
  <p>Now, I'm not one to use unspecific class-names (just how long <strong>is</strong> too long?) so nesting has very little functional use to me, but I find it makes my pre-compiled SCSS <em>extremely</em> understandable - the ability to imply the relationship an element has with its parent and children is invaluable to both myself and the next developer who happens across my code.</p>
  
  <p><strong>Is there any way to keep my SCSS nested in all or (preferably) part of my sheet without rendering endless child selectors in my CSS?</strong></p>