Table height:100%

Ever tried to get a <table> to take the whole browser height? Not a trivial task if you want to keep the browser in the Strict mode. Yes, removing

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “”>

will do, but that’s already the Quirks mode.

This css rule will work even in the Strict mode:

html, body, table#main {height: 100%}


9 thoughts on “Table height:100%”

  1. Thats Awesome! I’ve been battling with this forever, and ultimately just threw up my hands and went back to DOCTYPE Transitional 4.0 to make it work. I prefer this much more!

    Any reason why this works? even though i dont have a table with an id of “main?”


  2. I put a table inside the page, and it went a little more than the browser’s height. In my case, I fixed it removing the margins and reducing a little bit the height percentage:

    height : 98%;
    margin-left : 0;
    margin-top : 0;

Leave a Reply

Your email address will not be published. Required fields are marked *