Streaming live at 10am (PST)

Videos have a wrong aspect ratio on my CMS

Hello Webflowers!
I’m having a hard time with my CMS template.

Uploaded videos have the wrong aspect ratio on my blog.
Instead of the regular 16:9, they’re appearing as a narrow video with black bars at the sides:

I tried fixing this by setting a min-height of 480px to the Figure element within my articles (I’m by no means a Webflow expert, I’m tweaking the work of a Webflow designer) and it worked.

The problem is that it also forced all my images to have a min-height of 480px and that destroyed the layout of my blog posts.

Is there a way to have videos showing up correctly on both desktop and mobile using a standard 16:9 aspect ratio?

Thank you for your time,

  • G

Here is my site Read-Only: Webflow - EventLive

Ahh, at least I know what this means now.

To get aspect ration correct you need to use padding bottom of the container.

If this fixes the problem please tick solution and the love heart. It helps to keep the forum tidy.

Hey iDATUS, thank you for helping me with this.
I’m a bit lost, to be honest.

Where should I add the padding-bottom?
Btw, the link says “padding top” but you suggested padding bottom. Not sure if I’d achieve the same result.

Do I apply it to all Figures?
I tried and it broke every single image on my CMS.

It doesn’t matter if you use the top or bottom.

The div that contains the video.
the H and Max W settings are for my needs but may help you as well.

Here are set for the embed (video) I used.

Let me know how you get on.

Thank you for replying.
Did you test this yourself? I think it doesn’t work within the CMS, as the Div needs to be placed within a Figure element, and it can’t be edited (the Div).

Check the right column: It can’t be edited. I can edit the Figure, but it also affects 100% of my images.

Sorry I don’t currently have knowledge of the all figures and don’t see any help on it.
I assumed the div was being populated by cms.
I know you can edit RTE and its on my to learn list.
If you have more information or find a solution please post.

I had a look at the RTE webflow tutorial which was interesting but I also had a play with the figure class.
You can change those settings. I can’t tell if they work or not as when I go to view it shows the video as you show it in your last post.

Thank you for trying!
I did modify my Figure class, and it changes all the images within every Article of the website.

Did you try my read-only link? You can actually play with my website in there:

I couldn’t find a way to tweak video sizes without messing with the Image ones.