<html>
<div class="container">
  <p>0.875em - 14px</p>
</div>
<div class="container with-font-size">
  <p>1.5em - 24px</p>
  <p class="bigger-p">1.5em - 36px</p>
</div>
</html>
.container {
  font-size: 0.875em;
  margin: 1em;
  padding: 1em;
  background: #89cff0;
  
  &.with-font-size {
    font-size: 1.5em;
    .bigger-p {
      font-size: 1.5em;
    }
  }
}

html, body {
  margin: 0;
  padding: 0;
  font-family: Helvetica, Arial, sans-serif;
}

p { margin: 0; }
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.