JSFiddle - React, Tailwind, and code Playground

by koralarts

HTML

<div class="first-group">
  <p class="half">0.5em</p>
  <p class="single">1em</p>
  <p class="double">2em</p>
</div>

<hr />

<div class="second-group">
  <p class="half">0.5em</p>
  <p class="single">1em</p>
  <p class="double">2em</p>
</div>

CSS

.first-group {
  font-size: 20px;
}

.second-group {
  font-size: 80px;
}

.half {
  font-size: 0.5em;
}

.single {
  font-size: 1em;
}

.double {
  font-size: 2em;
}