How to make react-table header and checkbox fixed?

Question

I am using react-table with selectTable HOC. I want to make checkbox and header both fixed. I can make both individually fixed but when i tried to make fixed togather this is what happening.

Here is what i have tried. https://codesandbox.io/s/jzr870m25

any help would be appreciated.

Answer 1

I was able to do this using position: sticky;

Here is example of it.

https://codesandbox.io/s/54z882qno4

Answer 2

I prefer use reactabular . So far, I think it's the best table library for React. But, it's a bit challenging.

You can see demo on CODESANDBOX .