JSFiddle - React, Tailwind, and code Playground

by AndyMP

HTML

<div class="box1">Ems</div>
   -
    <div class="box2">Rems</div>
   -
    <div class="box3">
    Pxs
    </div>

CSS

html {
  font-size: 1em;    /* 16px */
}

.box1 {
  width: 10em;
  border: solid .25em black;
  font-size: 1.5em;
}
.box2 {
  width: 10rem;
  border: solid .25rem black;
  font-size: 1.5rem;
  }
.box3 {
  width: 160px;
  border: solid 4px black;
  font-size: 24px;
}