Image grid maximum height of images

I want to define a maximum heigth of a displayed image in an image grid. Currently I have 3 columns and a min. width of 150px. As the images I display are in various aspects , the height of each image is different. Is there a way to adjust this or another solution instead of usinfg the component image grid ?

Hi @Jorg_Segers, interesting problem. If you change the aspect ratio to 1 in the image grid this should make the height of all the images identical (play with the options between 0 & 2, e.g. 0.5 and so on). However if you want to choose the fixed height of your images more specifically, here are some possible workarounds:

1/ Use the image component instead and set the height to fixed. Resize the number of image components you need, to be identical to each other.

2/ Use the table component to imitate an image grid. You can follow these docs, and use the screenshots as pointers, to fix the height via HTML. The downside here is that the images are slightly distorted. In this example, I have fed the images to the table in a raw format. This may not be a preferred method depending on how you're sourcing the images. To make the look cleaner, you can also hide the column headers.

Hope some of that is helpful!

Hi Jade,
thanks for your reply and helpful tips. I think I will use a few image components. They should do the job...

But still, a parameter for a fixed height would definitely enrich the image grid component :wink:


Absolutely! I've logged that as a feature request and will update this channel accordingly. Have a good one!