title: how to set a minimum width for your site / viewport and have browser scale if the width is below that
body: <p>I'm trying to wrap my brain around viewports / scales. I have a site I have to program, and the design I've been given is responsive, but it really doesn't work if the device's width is below 420px. </p>
  
  <p>At anything below 420px, I'd love it if the browser would render the site as if it were 420px wide, just zoom everything out, but I can't figure out how to do this. </p>
  
  <p>I've seen how you can dynamically change the meta viewport tag, but when I do this, it doesn't seem to have any affect, and I'm not sure that's the best way to approach what I'm trying to achieve. </p>
  
  <p>At any rate, this is what I tried:</p>
  
  <pre><code>var minBP = 420;
  //ww = window width
  
  if (self.ww &lt; minBP &amp;&amp; lastScreenWidth &gt; minBP){ //site is smaller than minimum allowed width, modify viewport
      var viewportString = "width=" + minBP + ", initial-scale=1.0";
      $('#blackrock-viewport').attr('content',viewportString);
  }
  </code></pre>
  
  <p>Anyone know how to render a scaled-out 420 viewport width when the browser drops below these dimensions?</p>