title: Height 100% not working for DIV tag in Internet Explorer 8
body: <p>I have the following code that I am using to display a search tool with a scrolling results section. In IE the code works fine:</p>
  
  <pre><code>   &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"&gt;
      &lt;html style="background:black;height:100%;width:100%;"&gt;
      &lt;head&gt;
        &lt;title&gt;Report&lt;/title&gt; 
      &lt;/head&gt;
      &lt;body style="background:black;"&gt;
        &lt;table HEIGHT="100%" WIDTH="100%" style="background:red;"&gt;
        &lt;tr&gt;
        &lt;td&gt;
          Search Area  
        &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
        &lt;td HEIGHT="100%" WIDTH="100%" style="background:orange;"&gt;
          &lt;div style="overflow-y:scroll;height:100%;"&gt;
            &lt;table style="width:100px;height:1000px;"&gt;
            &lt;tr&gt;
            &lt;td style="background:white;"&gt;
              Results Area
            &lt;/td&gt;
            &lt;/tr&gt;
            &lt;/table&gt;
          &lt;/div&gt;      
        &lt;/td&gt;
        &lt;/tr&gt;
        &lt;/table&gt;
      &lt;/body&gt;
      &lt;/html&gt;
  </code></pre>
  
  <p>But when I set the meta tag to use IE8 formatting by adding:</p>
  
  <pre><code>&lt;meta http-equiv='X-UA-Compatible' content='IE=edge' /&gt;
  </code></pre>
  
  <p>The bottom DIV tag expands beyond the page. I have tried a number of options though and can't find a way around it without actually specifying a height for the values. Which will not work as I want the page to take up 100% of the screen no matter the size of the browser window.  </p>
  
  <p>Any help would be much appreciated.</p>