title: Div 100% height works on Firefox but not in IE
body: <p>I have a container div that holds two internal divs; both should take 100% width and 100% height within the container.</p>
  
  <p>I set both internal divs to 100% height. That works fine in Firefox, however in IE the divs do not stretch to 100% height but only the height of the text inside them.</p>
  
  <p>The following is a simplified version of my style sheet.</p>
  
  <pre><code>#container
  {
     height: auto;
     width: 100%;
  }
  
  #container #mainContentsWrapper
  {
     float: left;
  
     height: 100%;
     width: 70%;
     margin: 0;
     padding: 0;
  }
  
  
  #container #sidebarWrapper
  {      
     float: right;
  
     height: 100%;
     width: 29.7%;
     margin: 0;
     padding: 0;
  }
  </code></pre>
  
  <p>Is there something I am doing wrong? Or any Firefox/IE quirks I am missing out?</p>