Streaming live at 10am (PST)

Embedded YouTube videos are different sizes in CMS?

Building a CMS for a music podcast. Each episode page has a different youtube video embedded. The first 2 are fine:

But for some reason the YouTube video is coming in at a bigger height in the 3rd one?

Any idea what might be causing this?

@alexc220 are you able to share the read-only/published link?

1 Like

Sure, here you go :slight_smile:

https://preview.webflow.com/preview/ceol-mining?utm_medium=preview_link&utm_source=designer&utm_content=ceol-mining&preview=454a33ad12fac57f2fd55a704770430c&mode=preview

The video element has a set padding-top: auto. Which by default will adjust the aspect of the video based on the origin.

You should be able to override this with the code below and set Video 2 to 100% width and height to fill the div parent.

<style> .video-2 { padding-top: 0px !important; } </style>

Just add a HTML embed on the page or you can also just add it into the section of the page.

1 Like

Thanks so much for this @dennyhartanto. Just so I’m clear, should I be putting this in the body or the head of the page?

Have also tried styling the “video” class (in addition to “video-2”) but it doesn’t seem to be working. You can see from the link below I’ve done the html embed and custom code in the page but no luck :frowning:

https://preview.webflow.com/preview/ceol-mining?utm_medium=preview_link&utm_source=designer&utm_content=ceol-mining&preview=454a33ad12fac57f2fd55a704770430c&pageId=6002b3649b8a536d26fb6049&itemId=60044e889d09e5c32e768894&mode=preview

@alexc220 Very close. you just have to do this and it should be fixed.

Screen Shot 2021-01-20 at 14.28.58

1 Like

@dennyhartanto you are a life-saver - thank you so much! Works perfectly now.

1 Like