Topic: Netscape table woes (Page 1 of 1)

I'm trying to create a table format for my 'low browser' version of my website. The homepage is a banner image with some text under it. I want the top cell to be just slightly larger than the image, and the lower cell (with the text) to take up the remaining room. IE has no problem with this, but Netscape keeps making the top cell take up over half the page, so the text is far below the image.

This is the latest iteration of the html:

<table border="2" width="100%" height="100%">
<tr height="1px" valign="top"><td align="center">
<img src="images\banner.gif" width="500" height="120"></img>
</td></tr>
<tr height="*" valign="top"><td align="center">
Line one.<br>
Line two.
</td></tr>
</table>

I've also tried making the tr hieights 1%/99%, and putting various height specs in the <td> tags.
The border spec is just so I can see where the cells are. The problem is there whether the border is specified or not.

Addendum: The easiest way to get the text under the image is to not specify a table height. This makes all the cells just as tall as the content forces them.

I'm looking for a solution that lets me keep the table specified as 100% height, so I can assign cell colors and not have it look stupid

im guessing your <img src="images\banner.gif" width="500" height="120"></img> is a typo of sorts. should be "images/banner.gif", and there isnt a closing img tag. even if it were xml, i thought the syntax was supposed to be <img src="images\banner.gif" width="500" height="120" /> for elements that dont have a closing tag.

try making your second row height=100%. i had to look it up because i wasnt sure, but tr isnt supposed to have a height or width attribute, only td's do.


------
this rose has a thorn...

I have a bad habit of using backslashes. Luckily, the site is currently running on my win2k workstation, and it doesn't care. I will correct that.

I also have a bad habit of putting end tags on <img> tags (I use XML a lot, and habitually endtag everything). Browsers don't care, so I've gotten away with it

I originally had the height specs in the <td> tags, then tried the <tr> tags when the <td> ones didn't work.

100% for the height of the lower cell doesn't work. It seems to make the lower cell 100% of the height of the browser, so I get a vertical scrollbar and the table goes off the bottom of the page. I was able to make it look right at 1024x768 by using 23% for the top cell and 77% for the bottom one, but it doesn't work at any other resolution (since 23% of the client window height is only correct for a 120px tall image at that resolution). The table becomes too tall at lower browser sizes (vertical scrollbar again), and the top cell gets too tall at higher ones (text too far below the image).

This is the latest html, that only works with a browser at nearly max size on a 1024x768 screen:

<table width="100%" height="100%" border="2">
<tr valign="top"><td height="25%" align="center">
<img src="images/0001/banner.gif" width="500" height="120"></img>
</td></tr>
<tr valign="top"><td height="75%" align="center">
line one.<br>
line twe.
</td></tr>
</table>

Note that specifying hard percentages has broken the html for IE, which worked with 1%/99% (the top was forced larger by the image, and the lower was squashed to fit in the table). Using 1%/99% on Netscape forces the table to image height + 99% of browser client window height and makes the page too tall (with a vertical scrollbar).

[This message has been edited by Das (edited 05-08-2001).]

you could always use javascript to control the height of the cell (there is a thread i started in the javascript forum on it).

the problem with netscape is that if there is no vertically scrolling at all, even if your table width=100%, it will leave a gap there where the scroll bar *should* be. thats why i use height=100%, to force scrolling in netscape.

------
this rose has a thorn...