T
TanStack5w ago
fascinating-indigo

Resizing with flex containers

In Tanstack Table, here is basically what I want to do. I have a table like UI using divs. Each row is a flex container. This way I can say how much space a column should take relative to others. I want to introduce column resizing. So what I want to do is when initially rendered, the columns should take the width according to flex rules and those columns must be able to be resized later. The problem is when both width and flex properties exist on the same element flex takes over and the column is not resizing. How can I achieve this?
2 Replies
fascinating-indigo
fascinating-indigo5w ago
Have you tried applying the desired width to the min-width property? Flexbox is going to have to be set up without any overriding parameters like shrink and grow if you need width to work. Otherwise I’d probably recommend using CSS Grid instead. It’s much more in tune with the original layout of a table.
fascinating-indigo
fascinating-indigo5w ago
If you need more insight in to the different CSS specs, Josh is a great resource. https://www.joshwcomeau.com/css/
CSS articles • Josh W. Comeau
Friendly tutorials for developers. Focus on React, CSS, Animation, and more!

Did you find this page helpful?