make tr fixed position relative to containing div 1

[1DMF]

is it possible to make a table row fixed position so when I scroll the div the "headings" stay visible?

If I use two tables the heading columns and the actual data don't line up due to the content moving table column widths.

Also I used position:fixed and that stuck it to the screen so when the page scroll bar was used it stayed fixed to the screen which I don't want.

the link to the test site is

http://www.stepnstomp.co.uk/new/top40.html

the table is where I want to fix the headings when the containing div scrolls?

what's the best way to do this?

thanks 1DMF

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you.

 

[vacunita]

Take a look at this:

http://www.imaputz.com/cssStuff/bigFourVersion.html

View its source, its well commented. and will guide you through it.

It uses the <thead> and <th> tags to fix a the table header.

It also tells you how to account for IE discrepancies.

----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

 

[1DMF]

It doesn't seem to work in IE7, i checked in FF and all is fine, I'll have a play and see if I can adapt for my purposes.

thanks, 1DMF

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you.

 

[1DMF]

nope, will not work in IE7, works fine in FireFox, oh well.

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you.

 

[vacunita]

It explcitly tells you what to do to make it work in IE, don;t kn ow for IE7 it should have been fioxed, and probably would work without all the extra stuff.

I created one a while bakc based a bit on that example without all the wextar CSs hacks and stuff and works pretty good in both IE6 and Firefox, don't know about IE7 though, but let me see if i can find the original source code.


----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

 

[1DMF]

thanks, but i would have to say it's an IE7 problem as the link you gave doesn't work.

it seems to apply the height to the TD (cells) of each row in the tbody instead of applying the height to the tbody itself!



"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you.

 

[1DMF]

I've found a working solution using this site as a guide.

http://web.tampabay.rr.com/bmerkey/examples/nonscroll-table-header.html

for those looking for an IE7 & Mozilla compatible answer.

dunno if it'll work in IE6 though, I wonder what the stats on those who have not installed the forced critical update IE6->IE7.

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you.

 

[traingamer]

Works fine in IE6 - still have that version at work (and on most of home pcs - 3 of 4 haven't updated yet).

Greg
"Personally, I am always ready to learn, although I do not always like being taught." - Winston Churchill

 

[1DMF]

thanks for the info.

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you.