Hey guys. Ive been having this problem for quite some time now but havn't been able to find a way to fix it.
If you visit my page:
Those of you who are using IE5.5 will notice that the blue nested table under the picture on the left does not expand to fill the entire cell.
I have set the height to 100% but this still does not seem to solve the problem in IE5.5. Strangly however it works in IE5.0
I made this site in both Frontpage and Dreamweaver so the code is extremely messy and consists of many nested tables.
Thanks in advance for your help
Honestly, I would stop messing with it, since it's not coming right easily, and just eliminate it. White space is not a bad thing, and I don't think that having that area be blue all the way down to the end of the area is necessary. There are times when you have to stop trying to work a design problem out, when you've got it 95% solved and the browsers are being cranky...I think it would look just fine without the blue area. That's MHO, of course :)
Try not to use the HEIGHT attribute with tables when you can. Netscape4 only recognises it on the outer most table and IE5 has it's problems with it too, as you've noted. There are 3 or 4 ways around it.
The simplest is to :
1) Eliminate the current blue table completely
2) Make a blue and white gif that is about 250 pixel wide (50 or so high). It's blue left half should be 141 pixels wide, with the rest white.
3) Drop that gif into the background of the cell that holds the table that holds your rollovers
<TD bgColor=#ffffff vAlign=top width=244 background="newgraphic.gif>
<TABLE bgColor=#ffffff border=0 cellPadding=0 cellSpacing=0
<TD vAlign=top width=95><IMG border=0 height=400
That will be quicker, and it will look better as it renders.
(I'd maybe take a little of the 'sting' out of that blue though. It's a little jarring against your other more muted tones. In fact, using this method you could create a 'seemless tile' using the sky tones at the top, and run that down the lefthand side)