Embedded YouTube responsive video in a Blog article

Hello Webflowers,

I’m embedding a YouTube video in a blog article with a custom code (because Webflow Rich Tech Editor is limited, I can’t color specfic words).

I put fixed dimensions to size the iframe, it looks great on desktop but it’s too big on mobile because it’s not responsive of course:

This is the HTML code I put with fixed dimensions

<p style="text-align: center"><iframe width ="500" height ="280" src="https://www.youtube.com/embed/ihPpNHiX3vE?autoplay=1&mute=1&wmode=opaque&rel=0" frameborder="0" allowfullscreen=""></iframe></p>

I tried to use % like width =“30%” height =“30%” but the height keeps being the same.

How can I have a YouTube embedded video in the Blog custom code being mobile responsive please?

This is my read-only link:

Thanks a lot :slight_smile:

hi @gabriel.hovy what research you have done on your own as here is many solved requests for identical issue. Feel free to use search input field (top right) and use keyword “responsive video”

Hi Stan, I checked some of the Help articles but the ones I saw where all talking about div styling outside the code.
When you use the custom code in a Blog article, you don’t have access to the style of the div with Webflow tools you have (like responsive design) for custom code in a page.
Like this answer:

I can’t see the div outside of the custom code block in the article so I can’t chose the size for each device:

I’m still very new to Webflow & HTML/CSS.