<div id="one" class="border">
  <div class="inner red">test</div>
  <div class="inner blue">test
    <div class="inner blue">test</div>
  </div>
</div>  
<div id="two" class="border">
  <div class="inner red">test</div>
  <div class="inner blue">test
    <div class="inner blue">test</div>
  </div>
</div>  
  
div { width: 90%; margin: 1em auto; padding: 1rem;}
.border { border: 1px solid green; }

.inner { border: 1px solid black; }
.inner .inner { border: 2px solid black; }

.inner.red { border: 1px solid red;}

#one { border: 2px solid green;}
#one .inner { background: yellow;}
#one > .inner { background: AntiqueWhite;}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.