title: How to specify a max vw size for all elements that use vw units?
body: <p>I’m using <code>vw</code> on font, padding and margin sizes. I design mobile first. Everything looks good up until around 700 pixels, at which point fonts start too look far too big.</p>
  
  <p>I would like to ensure that fonts don’t grow larger than a specified value. Is it possible to set max font size?</p>
  
  <p>Here's some example code where I use <code>vw</code>. But after <code>700px</code> it starts to look too big to read comfortably.</p>
  
  <pre><code>#intro h1 {
      font-weight: 700;
      font-size: 8vw;
  }
  </code></pre>
  
  <p>My only thought was to use a media query and specify a pixel font size but that seems like the wrong tool for the job. I would have to create media queries for all elements that use <code>vw</code> units.</p>
  
  <p>Any advice?</p>