Equal slide height based on the tallest slide

Hi everyone,

I am looking for a way to make all slides to be equal height based on the tallest slide.
Currently all slides are different height, wondering if there is a workaround?

Here is the link to the actual site which I am currently working on:


Here is my site Read-Only:


The issue you’ve described appears to be resolved. Did you fix it? All slides have the same height on my end. Maybe I’m not understanding the issue.

Thanks for your reply. I forced the slides to be min height of 500px, but it’s not ideal.
I want all slides to be as tall, as the tallest slide.
Is there a way of doing this without defining fixed height?

In other words, the issue still remains.

Your min height assignment (based on your tallest slide) seems to clear up any issue with the tiles fluctuating in size. What is the issue you’re facing, that a non-fixed-height will solve? Is the problem that the slide content will be CMS managed, and potentially can break the layout? In this case, I would set a max number of characters so that your client can’t break the layout.

So I have removed min height and now it’s visible where the problem is. I want all the cards to be same height based on the tallest card, which in this case is “Data Analytics as a Service”.

So the content defines how tall will be the tallest slide and the rest of the slides should be same height. Does this make sense? :slight_smile:

Not possible since the slides are individual elements and you cannot set a flexbox property on the mask element to tell the smaller slide heights to “stretch”.
The native slider component doesn’t offer a vertically responsive option so I’ve always used fixed height. I liked your min. height approach and I’m trying to imagine how a flex stretch option would deliver a better look.
It does make sense if the slide content was controlled through the CMS and the content was unpredictable. In your instance it doesn’t seem to matter.