<div class="module-1">
  <p>I am sized relative to the document.</p>
</div>

<div class="module-2">
  <p>I am sized relative to the parent element.</p?
</div>
html {
  background-color: #cecece;
  font-size: 24px;
  line-height: 36px;
}

div {
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  margin: 50px;
  padding: 20px;
}

.module-2 {
  font-size: 42px;
  line-height: 36px;
}

.module-2 p {
  font-size: 110%;
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.