Embedded Youtube video is not filling the screen-CodePudding

The

CodePudding user response：

I have made the width 100% and given the iframe a min-height. I hope it serves the purpose you seek. Find screenshot below. Also, if you provided the entire code, then maybe I could suite the video size to match the design. Vote me up if this helps. Thanks

<div class="embed-responsive embed-responsive-16by9"> <iframe style="width: 100%; min-height: 315px;" src="https://www.youtube.com/embed/S8smZWM_dl8" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </div>

CodePudding user response：

Firstly you should remove these classes

<div class="container mx-auto mb-4">

Then add w-100 class to embed-responsive element

<div class="embed-responsive embed-responsive-16by9 w-100">

After that add min-height: 100vh style to your iframe

iframe{min-height:100vh;}

Now you have full screen youtube embed.