Aligning Dynamic Columns in a Table

Hi everyone,

I'm currently working on a project in Retool and have run into an issue that I hope someone here can help me with.

I have a table with dynamic columns, and I would like to align the text in these columns to the right. I've used HTML and applied text-align: right. but unfortunately, the text doesn't fully align to the right edge of the column. It seems that the built-in function to align a column is not available for dynamic columns.

Has anyone found a workaround or solution for this? Any tips or suggestions would be greatly appreciated


1 Like

Hi @JetzeJanssens, welcome back to the forum! :wave:

I've included your use case in our internal Feature Request for enhancing customization options for dynamic columns. In the meantime, although there isn't a built-in setting for this, here is a workaround:

Using Chrome dev tools, find the element (column) where the alignment is set to flext-start:

Test it's the correct one by changing the alignment to flex-end

Copy the rule by right clicking the box where we made the change:

Add this rule to the Custom CSS of your App:

The tradeoff is that all of the columns and headers will be aligned to the right.