Table height 100%

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Table height 100%

Post by pickle »

Hi all,

I'm sure this has been asked before, but I'll ask again to be sure anyway. Is there anyway to make a table be 100% the height of a page? (Without using JS of course :wink:) Thanks a bunch.

- Dylan
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

last I checked the height attribute worked.. (either CSS or table itself, depending on the compliance you want)
jollyjumper
Forum Contributor
Posts: 107
Joined: Sat Jan 25, 2003 11:03 am

Post by jollyjumper »

Indeed

Code: Select all

<table height="100%">
and

Code: Select all

<table style="height:100%;">
both work, although for some reason W3C validation doesn't accept the height property in a table tag, so this is why I always use the second piece of code.

You'll also have to make sure the table cell within the table has 100% height to get the result you are after.

Code: Select all

<table width="100%" style="height:100%;"><tr><td width="100%" height="100%" align="center" valign="middle">hello</td></tr></table>
should completely center the word hello.
User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post by Chris Corbyn »

I haven't tried this in a while but last time I tried percentages for heights it didn't work.

The only way I could get table heights working was in terms of pixels using either plain ol' HTML or CSS.

I'm gonna test this now. Could kinda mess your layout up though if ppl have weird resolutions.
slimsam1
Forum Commoner
Posts: 49
Joined: Wed Aug 21, 2002 12:20 am

Post by slimsam1 »

If I recall, those methods only work in IE.

If you're doing that to center something vertically, check out how I do it on my site, http://worksinmetal.com/ .
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Post by pickle »

Well, I've tried everything I can think of. I've set the height of the table using both HTML and CSS, as well as setting the height of all the cells using both methods, and nothing worked, in either Firefox or IE. I'm pretty sure it doesn't work, but I thought I'd be quite the idiot if it did work fine, but I was just doing something wrong.

I've just set the height of the table to 400, which is big enough to look decent, but small enough to fit in anyone's browser (I'm not expecting and PDA-browser traffic). Thanks for the input folks!
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
jollyjumper
Forum Contributor
Posts: 107
Joined: Sat Jan 25, 2003 11:03 am

Post by jollyjumper »

@slimsam: I use this method almost every day at work, and you are right it doesn't work in every browser, but it does in IE6, IE5.2 on Mac, Firefox(PC/Mac) and Mozilla. I'm not sure about safari.

@pickle:
Could you post an url where we can see the code?

Greetz Jolly.
Post Reply