title: Why isn't this basic Sass nesting example working?
body: <p>I'm starting to learn Sass and started to check some nesting examples. This is the first one I tried and it's not working:</p>
  
  <pre><code>body {background:#eee;}
  
  .blog .entry {
      p{
          color:#ff0;
      }
  }
  </code></pre>
  
  <p>This is my markup:</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;link rel="stylesheet" type="text/css" href="main.scss"&gt;
          &lt;script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;body class="blog"&gt;
          &lt;div class="entry"&gt;
              &lt;h1&gt;My blog post&lt;/h1&gt;
              &lt;p class="blue"&gt;Text &lt;a&gt;link&lt;/a&gt;&lt;/p&gt;
          &lt;/div&gt;&lt;!-- .entry --&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The background of the body does change to #eee, but the paragraph stays the same (unless I un-nest it to just p{} ).</p>