How To Make Youtube Video Background Cover In Full Section

I'm doing a section with Youtube video background and so far the video is working fine, but I found no way to make the video background to cover in full section, for whatever scree

Solution 1:

Try this to replace #story .videoFg, #story .videoBg iframe

#story.videoFg{
 overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
    height: 0;
}
#story.videoBgiframe {
      left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    position: absolute;

}

Solution 2:

You can achieve it by adding below css

* {padding:0;margin:0;box-sizing:border-box;}

.videoFg {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */height: 0!important;
}
.videoFgiframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

REF: disabling blackbars on youtube embed iFrame

#story.videoBg {
    position: relative;
    height: 700px;
}

#story.videoFg, #story.videoBgiframe {
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: hidden;
    z-index: -99;
}

#story.overlay {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;
    left: 0px;
    z-index: 1;
}

.videoBg.subTxt { 
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 50%;
    height: 50%;
    color: #FFF;
    text-shadow: 1px1px0pxrgba(0,0,0,0.3);
    z-index: 2;
}

/* FROM HERE */
* {padding:0;margin:0;box-sizing:border-box;}
.videoFg {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */height: 0!important;
}
.videoFgiframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

<sectionid="story"class="main story"><div><divclass="videoBg text-center"><divclass="videoFg"><iframesrc="https://www.youtube.com/embed/ab0TSkLe-E0?version=3&amp;controls=0&amp;showinfo=0&amp;rel=0&amp;autoplay=1&amp;loop=1&amp;mute=1&amp;playlist=ab0TSkLe-E0"frameborder="0"allowfullscreen=""></iframe></div><divclass="subTxt text"><h3>Origin Story</h3><p></p><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p><divclass="spacer_md"></div><p><aclass="play no-button"style="display:unset;"href="https://www.youtube.com/embed/2L515SmPbRw?autoplay=1&amp;rel=0">Watch video</a></p><p></p></div><divclass="overlay"></div></div></div></section>