title: Can I create a HTML table width a percentage height but pixel accurate row heights?
body: <p>I need to create a table on a web page that has two rows. The table needs to fill the entire page so I have set the height and width of the table to 100% in the CSS stylesheet and the height of the HTML and body to 100% too.</p>
  
  <p>However, I need to top row of the table to be exactly 100 pixels in height and the second row to expand to fit the remainder of the table. When I set the height of the top row, it doesn't work.</p>
  
  <p>Is this behavior possible? I tried the following but it doesn't work.</p>
  
  <pre><code>&lt;table style="border-collapse:collapse;height:100%;width:100%;"&gt;
    &lt;tr&gt;
      &lt;td style="border:solid 1px black;height:100px"&gt;1&lt;/td&gt;
      &lt;td style="border:solid 1px black"&gt;2&lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
      &lt;td style="border:solid 1px black"&gt;3&lt;/td&gt;
      &lt;td style="border:solid 1px black"&gt;4&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>Edit: I am using tabular data and specifically want to use a table, not divs. The sample above is to simplify a table with around 20 columns.</p>
  
  <p>Edit 2: I have found the issue. It is the doctype definition in the HTML (added by Visual Studio). After removing...</p>
  
  <p></p>
  
  <p>...it works perfectly. So my new question is, <strong>is this OK to do or is there a correct way to do it with the DOCTYPE?</strong></p>