Multiple tables within a scrollable div

[eceyhan]

I have a scroll-able div and in that div, there are multiple table elements. As the user scrolls, the corresponding table header needs to stay fixed.

Here is the to the jsfiddler : http://jsfiddle.net/eceyhan/f0rjzqL9/

Any help is greatly appreciated.

Thanks..

[mkoryak]

it helps if you include jquery and this plugin as deps in the jsfiddle, otherwise it doesnt work very well.

how about something like this:

http://jsfiddle.net/f0rjzqL9/2/

[eceyhan]

Thank you for your response.

It works great but I see table borders are displayed beneath the scrollable div. Please see below.

Do you know why this happens?

Thanks..

[mkoryak]

it happens because of fixed positioning. I dont have time to play around with this right now, but I think this can be fixed with css.

[mkoryak]

There was a bug with absolute positioning that I just fixed, see updated fiddle:
http://jsfiddle.net/f0rjzqL9/3/

note that this fix only exists on master at this time.

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.