How do I create an HTML table with a fixed/frozen left column and a scrollable body?

Question

I need a simple solution. I know it\'s similar to some other questions, like:

• HTML table with fixed headers and a fixed column?
• How can I lock the fir

Answer 1

No need to add any plugin, CSS can do this job !!!

The idea is to make the position of all the first cells in each column absolute, and make width fixed. Ex:

max-width: 125px;
min-width: 125px;
position: absolute;

This hides some parts of some columns under the first column, so add an empty second column (add second empty td) with width same as the first column.

I tested and this works in Chrome and Firefox.