JSFiddle - React, Tailwind, and code Playground

by Imabot

HTML

<div class="border pixel">100 pixels</div>
<div class="border millimetre">79.375 mm</div>
<div class="border centimetre">7.9375 cm</div>
<div class="border inch">3.125 inches</div>
<div class="border point">225 points</div>
<div class="border pica">18.75 picas</div>

CSS

body          { background-color: LightGray; }
.border {
  border: 1px solid black;
  margin: 20px;
  padding: 5px;
  background-color: GreenYellow;
  
}


.pixel        { width: 300px; }
.millimetre   { width: 79.375mm; }
.centimetre   { width: 7.9375cm; }
.inch        { width: 3.125in; }
.point        { width: 225pt; }
.pica         { width: 18.75pc; }