How to stretch an HTML table to 100% of the browser window height?

Question

I\'m using a table to design the layout of my web page. I want the table to fill the page even if it doesn\'t contain much content. Here\'s the CSS I\'m using:

Answer 1

Try using this:

html, body    {
  height: 100%;
}

So besides making the table's height to 100%, you also should have to make sure that the html'd and body's height are also 100%, so it will stretch properly.

Answer 2

You can handle this in Javascript/JQuery.

window_height = $(window).height();
$('#container').css('min-height', window_height);

Answer 3

Just use the height property instead of the min-height property when setting #container. Once the data gets too big, the table will automatically grow.