Probably an easy solution, but it kinda has me baffled ...

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
zick
Forum Commoner
Posts: 33
Joined: Thu Aug 14, 2003 3:18 pm

Probably an easy solution, but it kinda has me baffled ...

Post by zick »

I got a bit of a problem and I've tried a bunch of things and can't seem to get it right. The weird thing is that I know I've gotten it to work before, but I don't have any code snippets lying around for reference. Anyways here's the situation ... I'm making a splash screen for a site. The content on the screen is centered with 3 table rows, like so:

Code: Select all

<table border="1" cellpadding="0" cellspacing="0" height="100%" width="100%">
<tr><td height="*" width="100%">topSpan</td></tr>
<tr><td height="144" width="100%">content</td></tr>
<tr><td height="*" width="100%">bottomSpan</td></tr></table>
Then the center row is split into a couple of columns, one that is a certain width and 2 others that are supposed to be whatever's leftover, like:

Code: Select all

<table border="1" cellpadding="0" cellspacing="1" height="100%" width="100%">
<tr><td colspan="3" height="*" width="100%">&nbsp;</td></tr>
<tr><td height="144" width="*">leftSpan</td>
<td height="144" width="288">Logo</td>
<td height="144" width="*">rightSpan</td></tr>
<tr><td colspan="3" height="*" width="100%">&nbsp;</td></tr></table>
Now supposedly that's supposed to work ... but it doesn't. I found awhile ago that I was able to accomplish this feat if I used at least 2 fixed with cells, but I tried that and its not seeming to work real well.

My question is, if anyone knows ... what is the general rule that browsers follow on this? and does anyone have some code they'd be willing to share? thanx ...
zick
Forum Commoner
Posts: 33
Joined: Thu Aug 14, 2003 3:18 pm

Post by zick »

okay, for those of you who don't know the answer to this ... I'll answer my own stupid question. I found what makes it work. The table tag must have attributes width="100%" and height="100%" ... next the top and bottom row rows (topSpan and bottomSpan) must have attributes height="*" and width="*" ... not "100%"; that seems to be the answer.

well, thanks to everyone who played the game, but it seems that i'm the winner. oh well, maybe next time. :)
Post Reply