title: How do I make CSS styles dependant on its parent element
body: <p>I was wondering if it is possible to define the styles of an element depending on the value of the body ID.</p>
  
  <p>It is difficult to explain but something like this would be ideal:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;body id="home"&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>body#home {
    a { /* code here */ }
    p { /* code here */ }
  }
  
  body#profile {
    a { /* different code here */ }
    p { /* different code here */ }
  }
  </code></pre>
  
  <p>I know I can do this:</p>
  
  <pre><code>body#home a { /* code here */ }
  </code></pre>
  
  <p>but that becomes very repetitive.</p>
  
  <p>I will be looking forward to your responses,</p>
  
  <p>Peter</p>