title: jQuery outerHeight is not returning the correct value
body: <p>I am trying to dynamically set the height of the webpage content by subtracting the header and footer values from the window size and setting the content to this value on document load.</p>
  
  <p>Each of the functions parameters takes in an element id in order to grab the element height; excluding the content parameter.</p>
  
  <pre><code> function setH(header, content, footer) 
  {
      winH = top.innerHeight;
      winTitle = 32; // height value of the window title (part of the header)
      headH = $(header).outerHeight(true);
      footH = $(footer).outerHeight(true);
      contentH = winH - winTitle - headH - footH;
      $(content).css({'height' : (contentH) + 'px','overflow-y' : 'scroll'});
  }
  </code></pre>
  
  <p>The issue that I am running into is the outerHeight values are returning the wrong values. The header returns 23px and footer 40px.</p>
  
  <p>When examining the elements in FF and Chrome the values are 25px and 44px.</p>
  
  <p>I have tried using innerHeight,, outerHeight and outerHeight(true) but not getting the correct values. </p>
  
  <p>Any suggestions on what might be going wrong? or an alternative way to setting the height of the content dynamically? I'm running out of hair to pull so any help is appreciated.</p>
  
  <p>Edit: I am working with content in iframes. The following: <code>winH = top.innerHeight</code> is getting the height value of the top most iframe window.</p>