0

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.

Beryl Sam
  • 28
  • 4

2 Answers2

0

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; }

Jenny Kim
  • 19
  • 3
  • I did. The issue that then comes up is that iframe takes the whole width and browser, but the video keeps the same size. I'll maybe add an image for comparison – Beryl Sam Jun 24 '22 at 07:18
0

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?

Reto Weber
  • 48
  • 1
  • 6
  • While this may answer the question, it's best to include all the important details in or answer rather than just providing a link. Providing a link is always a good thing to do in order to give credit, but your answer should be written in a way that does not require the reader to click the link. – Jesse Jun 24 '22 at 22:16
  • Well it is a link to another StackOverflow answer. I can copy it. But this is just a duplicate of that question. But I update it. – Reto Weber Jun 29 '22 at 05:39
  • If it's a duplicate then flag it as such. Answers should include all important details relevant to the answer within the answer text. – Jesse Jun 29 '22 at 17:07