JSFiddle - React, Tailwind, and code Playground

HTML

<div id="div1">REM font size</div>

<div id="div2"></div>
<svg xmlns="http://www.w3.org/2000/svg">
  <path d="M 0 0 L 300 0 L 300 100 L 0 100" />
</svg>

<div>
  Notice that the second rectangle (drawn using SVG) appears blurry in IE and Edge (EdgeHTML).
</div>

CSS

#div1 {
  font-size: 1.1rem;
  margin-bottom: 20px;
}

#div2 {
  width: 300px;
  height: 100px;
  background: black;
  margin-bottom: 20px;
}