Home > Software design >  How do I stretch an iframe embed video to forcefully take the whole browser width>
How do I stretch an iframe embed video to forcefully take the whole browser width>

Time:06-24

I already tried using width and height 100% on it, but the issue that arises is that the frame itself takes the whole width and height, but the video keeps its aspect ratio, with a large grey frame around it. Using embeds from Vimeo and Youtube works well, but this issue arises when I use a custom CDN-based video - which is what I need.

CodePudding user response:

Have you tried doing min-width: 100% on the iframe? If the page is not full size, then it might be taking up the width of that. So you could also try: body { height: 100vh; }

CodePudding user response:

My first guess was to just make a CSS rule selecting the element inside the iFrame. But tt seems as you have to do it with Javascript and change the CSS of the loaded page in the iFrame. CSS is rarely able to do this on its own.

For more information see: How to apply CSS to iframe?

  • Related