<body>
<div class='em-parent'>
<div class='em-child'>
<h1>em</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque laboriosam suscipit sed corporis in fugiat at amet distinctio? Earum placeat, alias est assumenda repellendus ipsam non eum. Nobis, consectetur corporis.</p>
</div>
</div>
<div class='rem-parent'>
<div class='rem-child'>
<h1>rem</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque laboriosam suscipit sed corporis in fugiat at amet distinctio? Earum placeat, alias est assumenda repellendus ipsam non eum. Nobis, consectetur corporis.</p>
</div>
</div>
</body>
body {
display: flex;
text-align: center;
}
.em-parent {
font-size: 30px;
}
.em-child {
font-size: 1em;
}
.rem-parent {
font-size: 30px;
}
.rem-child {
font-size: 1rem;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.