Help with Table and Div Height at 100%

Roberto-C

New Member
Hi

I'm building a website which you can see at

http://98.131.116.118/

If you check the source you might notice I'm not much into coding, I'm more of the graphic design part so I've been usually using tables for everything untill lately.. (which I plan to switch to Divs and CSS soon) anyway..

My Issue is with that remaining space at the bottom, I want that pink cell to expand on to the bottom regardless of the resolution but whatever I try I keep getting that empty margin down there when I go fullscreen (it doesn't appear in 1024 x 768)

I tried assigning a CSS Height attribute to that table, both in CSS within the HTML and with an external CSS file.. I read in several forums they usually fix it that way..
But for some reason it's not working for me..

If anyone can think of any other solution please let me know, I know tables aren't the best option for layouts (one of the most tedious choices actually lol)

Whatever might work to expand that down on to the bottom of any resolution.

Thanks :)
 
Last edited:

webmasterdan

New Member
First make sure that none of the outter tables/divs have no set pixel height. Cell height specified is ok. Set the exterior most table/div to 100%.

If all else fails, then I suggest making a scratch page of similiar table structure so you can mess with it easily without damaging your main page.

Unfortunately this may be hard to implement due to how different browsers handle this. Some browsers might be fine, others... not so much so. Ultimately you might just have to deal with the way the page is now.
 

conor

New Member
i'm using firefox 3 @ 1024 x 768 resolution and it looks fine to me.

you have brilliant code and a great website for a beginner.

There are no links on the page or page header though - whats up with that? Hold on they are both characteristics of someone using dreamweaver... am I right?

heres a link that you might like :) http://shouldiusetablesforlayout.com
 

Roberto-C

New Member
Conor:
Thanks for the compliment on the site, if you meant the graphic part at least. As you could have guessed by me asking about this particular issue that might be simple to programmers, I'm not too deep into coding.
I'm more a creative/graphic designer than a programmer. Yes I'm using Dreamweaver, but no, no links on a footer or header is not a characteristic of using Dreamweaver, it's a characteristic of an unfinished page, I haven't added links yet. :) You might have related the sourcecode with Dreamweaver by it's distribution or Dreamweaver's default doctype at the very beggining.

About your link, I said it before, I already knew tables aren't the best option around, it's just what I'm forced to rely on in the mean time. As a (helpful) tip in exchange, if you try to help, don't employ that attitude in real life, it rarely generates a positive reaction among strangers..
Anyway.. :rolleyes:

webmasterdan:
Thanks, much appreciated! :)
But no, I'm afraid it's not the pixel height on the outer tables, I checked that and they're ok.. I thought of adding a table apart from the "most outer table", actually that's what I tried but not even that way.. I read I also had to specify the page's body height to 100% because tables alone at 100% expand at 100% of what is inside of them, not the rest of the page..
Several forum posts I read suggest specifying the height as a selector's attribute and assigning it to the table alone (along with the page's body at 100% or again it won't work) but nope.. didn't work for me.. :confused:
 
Last edited:

Geodun1

New Member
The issue is probably in that IE6 (I can only assume that's what you're having the problem in, since it's 90% of troubles.) doesn't recognize % based widths and heights very well. You might try using the auto element to see if that changes it.
 

Roberto-C

New Member
Geodun1:

Thanks, it works well at 1024x768 but once I go fullscreen I get that empty space at the bottom regardless of the broswer, and in bigger resolutions the empty space gets even bigger.. there's an independent bottom table that is supposed to expand to 100% of the page's body that is also set to 100%

Well now the heights are set to "auto", but yea they didn't change anything either.. :/
Thanks for the help anyway. :)
 

specialk

New Member
I am looking at it in 1024x768 resolution and I am using the fire fox web browser and it looks to be fine to me. I guess it is possible you have already corrected it but I see no problems.
 
Top