JSFiddle - React, Tailwind, and code Playground

HTML

<div id="root">
  <span>ROOT EM font-size: 1.25em;</span>
  <p class="em">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas  scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent convallis dui feugiat eros porta, vitae porta nisl lobortis. Duis eu nunc ultricies, pharetra velit eget, gravida nulla.</p>
  <span>ROOT PX font-size: 24px;</span>
  <p class="px">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas  scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent convallis dui feugiat eros porta, vitae porta nisl lobortis. Duis eu nunc ultricies, pharetra velit eget, gravida nulla.</p>
  <div id="first">
      <span>FIRST EM font-size: 0.9em;</span>
      <p class="em">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent convallis dui feugiat eros porta, vitae porta nisl lobortis. Duis eu nunc ultricies, pharetra velit eget, gravida nulla.</p>
      <span>FIRST PX font-size: 18px;</span>
    <p class="px">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent...

CSS

body { 
 background-color: #222;   
 color: white;
 font-size: 1em;
}

span {
 display: block;
 background-color: #840000;
 color: white;   
 padding: 10px;
}

#root {
 font-size: 1.25em; /* 20px */
}

#root .px {
 font-size: 20px;  
}

#first {
 font-size: 0.9em; /* 18px */
}

#first .px {
 font-size: 18px;
}

#secondwithinfirst {
 font-size: 0.88888888em; /* 16px */ 
}

#secondwithinfirst .px {
 font-size: 16px;
}

.outsideroot1em {
 font-size: 1.5em; /* 24px */
}

.outsideroot1px {
 font-size: 24px; 
}

.outsideroot2em {
 font-size: 1.875em; /* 30px */
}

.outsideroot2px {
 font-size: 30px;
}