Welcome to my world!

basics 2: vw

Here we have a box that measures 20vw square:

.simple-box {
  height: 20vw;
  width: 20vw;
  p {
    font-size: 4vw;
    padding: 2vw;
  }
}

In this example, the box will always measure 40% of the width of the viewport.  So, as we resize the browser horizontally, the box's size adjusts accordingly.  And, we're doing the same with the font size as we did in the previous example.