React Material-UI Sticky Table with Multiple Row Head and Dynamic Height

Viewed 630

I am using Material-UI with React to display a table. I would like to use a sticky header for a multi-row table head and I do not want to set a height on my table. I want all lines of the header to stick to the top of the page.

I have an example of what is causing me trouble in the sandbox - when I scroll down I want the "Value" and the "Another Value" row (which are both in the table head) to stick to the top, only the last row of the header is sticking. So all rows of the header should stick. So however many rows there are in the table head they should all stick.

My actual problem may have either two or three rows in the head and the height of each row is not fixed.

https://codesandbox.io/s/condescending-roman-hqkpj

0 Answers
Related