Streaming live at 10am (PST)

How can I set background video max height keeping the ratio?

Hi!

I’m trying to preserve the 16:9 aspect ratio of my background video on the Donate page, which I have achieved with 56.25% padding and auto height on the .bgvideo element, it works great, but I would like it to never exceed 100vh of the screen and keep the ration, it’s ok if the video will have black borders on the edges.

I tried to add Max-Height: 100vh on the section that wraps that bg video, but it didn’t work.

Please help


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hey Dmitry,

I tried some things with your read only link and here’s my results. I placed the BG Video inside it’s own div block (within your video section) and set the div to flex and middle aligned.
See the screenshots to match the settings if you like.

1 Like

Hey Ben, thanks for this, I tried this , but I didn’t get what you have. I’ve updated my project, could you see if I didn’t set quite like you did? Also I’m trying to preserve the video aspect ratio, so removing the 56.25% padding is not ideal

Hey did you resolve this? Just tried to take a look at your read only link and I got a 404.

1 Like

Yes, sorry forgot to reply, I eventually solved it by adding a separate video element to the desktop layout.