title: $(window).height() issues in IE and FF
body: <p>I wrote a script to make a dynamic sized <code>div</code> (#table) inside my page. I also have a menu (#menu) with a <code>nav</code> inside that establishes the min-height. In Chrome and Safari it all works ok, but in IE/FF not so much. In both I have the same problem: If I load the page full screen and then I minimize it with the minimize button, it takes the wrong  <code>$(window).height()</code>. If I reload it minimized, it works ok, I can even resize such that  the div adjusts ok. I put some images to be clear about what I'm talking about.</p>
  
  <p>With FF I have another problem. It always has a space in the bottom of the div when the window size is bigger than the menu. Its like the value that I apply in the other browsers doesn't fit for Firefox. 
  This problem is only with the height. The dynamic width works ok.</p>
  
  <p>The <strong>versions of my browsers</strong> are the following: I think they are the latest ones.</p>
  
  <ul>
  <li>Chrome 21.0.1180.89 m</li>
  <li>Safari 5.1.7</li>
  <li>Internet Explorer 9</li>
  <li>Firefox 14.0.1</li>
  </ul>
  
  <p><strong>Here is my javascript/jQuery code:</strong></p>
  
  <pre><code>&lt;!-- Menu resize --&gt;
  &lt;script type='text/javascript'&gt;
  $(function(){
      $('#menu').css({'height':(($(window).height())-350)+'px'});
      $('#table').css({'height':(($(window).height())-225)+'px'});
      $('#table').css({'min-height':(($('nav').height())-15)+'px'});
      $('#table').css({'width':(($(window).width())-135)+'px'});
  
      $(window).resize(function(){
            $('#menu').css({'height':(($(window).height())-350)+'px'});
            $('#table').css({'height':(($(window).height())-225)+'px'});
            $('#table').css({'width':(($(window).width())-151)+'px'});
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Part of page <strong>style</strong>:</p>
  
  <pre><code>/* NAV */
  
  #line{
      width:1px;
      position:absolute;
      left:147px;
      top:123px;
      bottom:0px;
      background-color:#b3b3b3;
  }
  
  nav{
      width:147px;
      min-height: 100%;
      float:left;
  }
  
  nav ul{
      list-style:none;
      padding:0px;
      margin:0px;
  }
  
  nav li{
      display:block;
      width:147px;
      height:24px;
      line-height:24px;
      border-bottom: 1px solid #b3b3b3;
      text-indent:30px;
  
      -moz-box-shadow:    inset 1px 1px 1px #ffffff;
      -webkit-box-shadow: inset 1px 1px 1px #ffffff;
      box-shadow:         inset 1px 1px 1px #ffffff;
  }
  
  nav li a{
      color:#808080;
      font-size:14px;
      text-decoration:none;
      display:block;
  }
  
  nav li:hover{
      background-color:#cccccc;
      -moz-box-shadow: none;
      -webkit-box-shadow: none;
      box-shadow: none;
  }
  
  nav li .active{
      background-color:#fdad06;
      -moz-box-shadow: none;
      -webkit-box-shadow: none;
      box-shadow: none;
  }
  
  nav li a.active{
      color:#7e5303;
  }
  
  nav li:first-child{
      border-top: 1px solid #b3b3b3;
  }
  
  nav #group{
      width:148px;
      height:49px;
      font-size:14px;
      font-weight:bold;
      line-height:49px;
      text-indent:22px;
  }
  
  /* SECTION */
  
  #menu_and_content{
      width:auto;
      display:block;
      background-image:url(images/background.jpg);
      box-shadow:inset 0 5px 5px rgba(0,0,0,.2) 
  }
  
  #menu_and_content #menu{
      width:148px;
      vertical-align:top;
      border-right-style:solid;
      border-right-width:1px;
      border-right-color:#b3b3b3;
      padding: 0px 0px 20px 0px;
  }
  
  #menu_and_content #content{
      width:100%;
      vertical-align:top;
  }
  
  #table{
      overflow-x:scroll;
      overflow-y:scroll;
      width:500px;
  }
  
  #table table{
      width:100%;
      font-size:11px;
      padding:25px 25px 25px 25px;
      text-align:left;
      }
  
  #table table thead th{
      font-size:12px;
      font-weight:bold;
      color:#969696;
      cursor:pointer;
  }
  
  #content table td, th{
      border-bottom:solid;
      border-bottom-color:#afafaf;
      border-bottom-width:1px;
      white-space: nowrap;
      padding:0px 5px 0px 10px;
      line-height:24px;
  }
  
  #content table td:first-of-type, th:first-of-type {
      padding-left:4px;   
  }
  
  #content table tr:hover:not(#captions){
      background-color:rgba(255,255,255,0.4);
      color:#3e3a34;
      cursor:pointer;
  }
  
  #content table input[type='checkbox']{
      margin-top:2px;
      border-color:#949494;
  }
  
  #login_container{display:block; height:260px;}
  </code></pre>
  
  <p>And <strong>here are the images:</strong></p>
  
  <p><img src="https://i.stack.imgur.com/riLvD.jpg" alt="LAYOUT"></p>
  
  <p><img src="https://i.stack.imgur.com/iqZyI.jpg" alt="CHROME"></p>
  
  <p><img src="https://i.stack.imgur.com/6pNOP.jpg" alt="SAFARI"></p>
  
  <p><img src="https://i.stack.imgur.com/Ioj4z.jpg" alt="INTERNET EXPLORER (PROBLEM 1)"></p>
  
  <p><img src="https://i.stack.imgur.com/8hsAd.jpg" alt="FIREFOX (PROBLEM 1)"></p>
  
  <p><img src="https://i.stack.imgur.com/hI67F.jpg" alt="FIREFOX (PROBLEM 2)"></p>