This is what I've done. http://jsfiddle.net/FeHdS/5/
As you can see, when you use the browser scrollbar the whole table goes behind the "mainwrapper" div. I would like to have my table with a fixed header and I don't want to use overflow scroll.
What I tried was to simply assign a fixed position to thead.
The relevant components are: