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

In case of fixed width left column the best solution is provided by Eamon Nerbonne.

In case of variable width left column the best solution I found is to make two identical tables and push one above another. Demo: http://jsfiddle.net/xG5QH/6/.

    

         
aaaaaaa
         
ccccccccccc asdsad asd as
         
ccccccccccc asdsad asd as
    
    

         
cccccccc
         
xxxxxxxxxxxxxxxxxxxx yyyyyyyyyyyyyy zzzzzzzzzzzzz
         
xxxxxxxxxxxxxxxxxxxx yyyyyyyyyyyyyy zzzzzzzzzzzzz
    






    

         
aaaaaaa
         
ccccccccccc asdsad asd as
         
ccccccccccc asdsad asd as
    
    

         
cccccccc
         
xxxxxxxxxxxxxxxxxxxx yyyyyyyyyyyyyy zzzzzzzzzzzzz
         
xxxxxxxxxxxxxxxxxxxx yyyyyyyyyyyyyy zzzzzzzzzzzzz