Auto height and rearrangement of grid

[franticape]

i have setup a grid using one of your demos but i have a question.

I’m not used to creating grids so i’m a bit rusty on the logic behind it.

would you be able to tell me how i can make it so the biggest cell determine the height of the grid so the other elements adapt to it?

basically this is what i want it to look like: https://prnt.sc/U7JwVbUqwlqd
and this is how it currently looks: https://prnt.sc/zL168_4tj0SF

as you can see, the gird is assymetrical and i have to manually set a height to an element to sort of make it match, which makes it a nightmare to setup responsively.

I’m pretty sure there’s a better way for it, i just don’t know grids that well to make it happen. can you help me out?

[Studio8100]

Have you tried to set the Image Element width and height to 100%? You will also need to set the size to Cover (Fill might work too). Position should be Center. With the Parent Grid Cell positioned how you like it, the image should fill up 100% of its parent container

[franticape]

Right now i left everything as it was initially. the main issue at the moment is that the “big” column is a video, not an image. i have set it to 100%, parent center and nothing. the video is a vertical video so it has the correct aspect ratio, however, for some reason if i set the video to 100% (the video container and/or the actual video element) then it actually becomes horizontal, even though that’s not the correct aspect ratio.

[prakash_s]

Hello @franticape,

Thanks for writing to us.

It seems that the grid setting is fine but the video is not aligned properly, I would suggest you please go to the Video element —>Frame —>Ratio–>set it as 12.5:16. Please have a look at the given screenshot below.

Hope it helps
Thanks

[franticape]

I had to fix a bit the ratio but that was indeed it. thank you very much!

[tristup]

Hi @franticape,

Glad that we are able to help you.

Thanks