Height proportional to width using VW unit

ref https://stackoverflow.com/a/38217322

by Roberto Apasajja

HTML

<div class="outside a">aaaa</div>
<div class="outside b">bbbb</div>

<hr>

<div class="outside c"><div class="internal">cccc</div></div>
<div class="outside d"><div class="internal">dddd</div></div>

CSS

.outside {display: inline-block; background: grey;}

.a {
  width: 40vw;
  height: 20vw;
}

.b{
  width: 40%;
  height: 20vw;
}

.c .internal {
  margin-bottom: 20vw;
}