Question

I need to represent huge data(37 columns,1000+ rows) in web. I would like to fix header row of this table and then manipulate data accordingly.

There are lots of possible solutions in web, some of them depends on css and some depends on javascript.

I have tried lots of them, and each time I ve stucked at the same point where table header cells and table row cells are not aligned.

First way i have tried : https://s12-chicago.accountservergroup.com/~gomathik/demos/scroll.html
Second way i have tired : http://www.imaputz.com/cssStuff/bigFourVersion.html#

They both, fixed the header of course. But i still have the alignment problem.

Do you have any suggestions?
I m begginer to html and css, any help would be appreciated.

Thank you in advance!

Answer 1

i have some experience in this and i can give you some thoughts/ pointers:

• easiest way to do this is to set table style to fixed, then you can change column widths with css and they will stay that wide regardless of content inside.
• after your column widths is pre-defined, you can clone the thead into another table above your table and it will act like a fixed header

otherwise you will need to:

• set the height of the header to 0px
• clone the header into a table above the table
• set the width of the new header’s table to the width of original table
• set the outerwidth of each cell in the new table to the outer width of the same header cell in the original table

also, none of the solutions for doing this seem to be good. i found that writing a custom solution is always better then trying to arm wrestle an existing generic plugin into doing what i need.