Answers for "How do I auto resize an embedded YouTube video"

0

How do I auto resize an embedded YouTube video

You will need to wrap the responsive youtube embed code with a div and specify a 50% to 60% padding bottom. Then specify the child elements (iframe, object embed) 100% width, 100% height, with absolute position. This will force the embed elements to expand fullwidth automatically.
.video-container {
    position: relative;
    padding-bottom: 53.2%;
    padding-top: 30px; height: 0; overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
<div class="video-container">
<iframe class="youtube-video" src="https://www.youtube.com/embed/6B51y3bf5gM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>
</iframe></div>
Posted by: Guest on October-04-2021

Code answers related to "How do I auto resize an embedded YouTube video"

Browse Popular Code Answers by Language