title: How does one get the width of an absolute/fixed element with jquery/js, on resize?
body: <p>Lets say you have a fixed or absolute positioned element:</p>
  
  <pre><code>&lt;div&gt;
     My fixed div.
  &lt;/div&gt;
  </code></pre>
  
  <p>With the following css:</p>
  
  <pre><code>div:first-of-type {
      background-color: red;
      position: fixed;
      top: 20px;
      left: 20px;
      right: 20px;
      bottom: 20px;
  }
  </code></pre>
  
  <p>You can figure out the width via:</p>
  
  <pre><code>$(function() {
      $(window).resize(function() {
          var $myFixedDiv = $('div:first');
  
          console.log($myFixedDiv.width()); //$myFixedDiv.innerWidth(), $myFixedDiv.outerWidth() 
      });
  
  });
  </code></pre>
  
  <p>However, when you resize the window, the width reported by both firefox and chrome is 0.</p>
  
  <p>How would one figure out what the true width is?</p>