Tailwindcss: table overflowing parent and ignoring column widths
Hi, please can you help me with styling of the table in tailwindcss?
I tried many variants with multiple wrappers, min-widths, max-widths, but I'm not able to make it works as expected.
Expectation is to have column widths as defined and table horizontal scroll instead of parent's overflow:
https://play.tailwindcss.com/Kx9zqEUCYf
Hello,
To achieve the desired table styling in Tailwind CSS with fixed column widths and horizontal scrolling, you can make use of the "table-auto" and "min-w-[0]" classes in combination with a wrapper div.
The table itself has the "table-auto" class for automatic column sizing and the "min-w-[0]" class to override any inherited minimum width constraints. Each column header and cell has a specified width using the "w-[200px]" class.
