How does one deal with grid layouts with variable columns per row, and want equal heights per row?

[amityweb]

I have a grid or flex layout which wrap my columns. I have different number of columns per width, so large may have 4, medium 3 columns, then down to 2. I do not use HTML to break these up as that is just PITA. CSS does it.

If I use EqualHeight which is great, it works, it changes ALL columns to the same height regardless of row. I noticed I have a lagr image in my last row, so all column image containers are set to that one, and so they are too large. Ideally you want it to have EqualHeight per row.

I am not sure how you would achieve that based on it being a flex or grid layout. I've never tried to see if JS can know the last or first elements in a grid/flex row. If it can, then this should be achievable.

In the meantime how does one deal with this? I think I will have to try to set a max. height on my columns content to prevent EqualHeight making them all too large based on a high one.

[loba-b]

Can you provide an example code in some online editor to show exactly what you mean, unfortunately I can't imagine it

[dungle-scrubs]

I think what he is describing is the same in this issue, is that correct?

[loba-b]

Ah, ok, I understand. So I would like to create some PoC.