Scrolling bar in a <Table> with "responsive" columns
I'm trying to design a table with a scroll bar.
The problem is that the columns don't adjust according to the information contained in the scrollbar. All the columns keep the same proportion because of the scrollbar located in <tbody>.
I therefore used Typescript code to modify the width of each column according to its content. It works fine, but the alignment of columns and values is not good. What's more, the scroll bar is inside the last column and alters the style of the buttons contained in the cells.
I don't know how to make the columns proportional and aligned according to the values, so that the style of the buttons isn't altered and the scroll bar is more outwards.
You can find the code on GitHub in the link "Click here".
And on Stackblitz "Click here"
Thanks for your help
The problem is that the columns don't adjust according to the information contained in the scrollbar. All the columns keep the same proportion because of the scrollbar located in <tbody>.
I therefore used Typescript code to modify the width of each column according to its content. It works fine, but the alignment of columns and values is not good. What's more, the scroll bar is inside the last column and alters the style of the buttons contained in the cells.
I don't know how to make the columns proportional and aligned according to the values, so that the style of the buttons isn't altered and the scroll bar is more outwards.
You can find the code on GitHub in the link "Click here".
And on Stackblitz "Click here"
Thanks for your help
A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.
36,263Members
Resources
Similar Threads
Was this page helpful?
