Scrolling table different behaviour in 3 browsers

[beary]

I'm trying to make a table with fixed header but scrolling body. The page is here

Here's the summary of what happens in the browsers:

FF3: Works almost perfectly. Scrolls as desired. Annoying unneeded bottom scrollbar is the only (minor) problem.

Safari 3 on PC: Displays table correctly but no scroll.

IE7: Really weird. Height of table rows is about 10-15 times what it should be, and of course, no scroll at all.

I haven't tested in IE6.

Is anyone able to view the link in either IE7 or Safari and give me some ideas why it's doing this.

Thanks

[David Laakso]

This is a simple suggestion-- I have not tried this. Make two tables. The top table is stationary. Enclose the bottom table in a division. Assign the height to the division (instead of tbody), something like this:

#anchor {min-height:340px;overflow-y: scroll;}
* html #anchor {height:340px;}
 

Tweak either the the top or bottom table -- or both -- so the vertical rules(borders) line up. Safari will scroll vertically. Confirm Opera is on board. IE/6 and IE/7 should go along for the ride without the current height issue. Whether IE/6 will need to be hacked for width remains to be seen.

[beary]

Thanks David. I have seen this method and may try to use it as a last resort. But to me it seems to be "cheating" a little. Also, I know it's something to do with my code, because on this other page (not mine) , scrolling works fine on all those browsers. I wonder if it's something to do with mine being in a table. And I'm really curious to know why IE7 goes so weird with the cell heights. Still hoping for help...

This is a simple suggestion-- I have not tried this. Make two tables. The top table is stationary. Enclose the bottom table in a division. Assign the height to the division (instead of tbody), something like this:

#anchor {min-height:340px;overflow-y: scroll;}
* html #anchor {height:340px;}
 

Tweak either the the top or bottom table -- or both -- so the vertical rules(borders) line up. Safari will scroll vertically. Confirm Opera is on board. IE/6 and IE/7 should go along for the ride without the current height issue. Whether IE/6 will need to be hacked for width remains to be seen.

[David Laakso]

You'll likely have a lot more luck all around, including control of cell height, if you structure the table using the CSS Table Model.