Some measures

HTML

<div class="px"></div>
<div class="rem"></div>
<div class="vh"></div>
<div class="vw"></div>
<div class="cm"></div>
<div class="in"></div>
<div class="vmin"></div>
<div class="vmax"></div>
<div class="ch"></div>
<div class="percent"></div>
<article>
  <div class="percent"></div>
</article>

CSS

article{ width: 100px; height: 100px; }
div { background-color: green; margin: 0.2em; }
.px { width: 100px; height: 100px; }
.rem { width: 1rem; height: 1rem; }
.vh { width: 10vh; height: 10vh; }
.vw { width: 10vw; height: 10vw; }
.cm { width: 1cm; height: 1cm; }
.in { width: 1in; height: 1in; }
.vmin { width: 10vmin; height: 10vmin; }
.vmax { width: 10vmax; height: 10vmax; }
.ch { width: 10ch; height: 10ch; }
.percent { width: 10%; height: 10%; }