Vertical center content in table rows?

Custom Coding
1

Hey everyone!
I’d like to center the content of my line vertically in my dynamic table block.
Right now, it’s all at the top and looks ugly…

Does anyone have a trick to do it? It doesn’t seem to be an option in the block design sadly.

Thank you for your help!

Capture d’écran 2024-05-25 à 15.51.39
Capture d’écran 2024-05-25 à 15.51.392430×1930 309 KB

2

+1, this is one of my longstanding Softr pet peeves!

1 Like
3

ChatGPT to the rescue!

I tried this in the code injection header section and it worked!

<style>
#yourblockname .ag-cell {
    display: flex;
    align-items: center;
    justify-content: start; /* Aligns content to the start of the cell, which helps in maintaining the typical table structure */
    height: 100%; /* Ensures the flex container fills the entire height of the cell */
}

#yourblockname .ag-cell-wrapper {
    width: 100%; /* Ensures that the wrapper fills the entire width of the cell */
    overflow: hidden; /* Prevents content from overflowing */
}

</style>
4

Nice! This is super helpful, thanks for the share!

Gotta love ChatGPT, I find myself talking to it on the daily.