title: window.outerWidth gives wrong value when using Firefox's responsive move
body: <p>I'm hoping there is a workaround for this, as its a bit baffling. In Firefox, you can press <code>Ctrl+Shift+M</code>, and it will go into a responsive mode so you can test the different display sizes. This works ok, but this acts a bit weird:</p>
  
  <pre><code>window.outerWidth
  </code></pre>
  
  <p>Sample code here:</p>
  
  <p><a href="https://jsfiddle.net/zpasjufs/4/" rel="nofollow noreferrer">https://jsfiddle.net/zpasjufs/4/</a></p>
  
  <p>If you resize the browser properly (outside of the "Responsive View" mode), it correctly shows the right dimensions - <em>but</em> if you look at it in "Responsive Mode" and then resize it, the dimension stays the size of the BROWSER (and not the viewport).</p>
  
  <p>Is there a way around this? Please ask if you need more clarification (I'm hoping the demo will show the issue). I don't remember having this issue when using jQuery to get the width of <code>$(window)</code>, but I'm not using jQuery in this project. </p>