
Good content takes time and effort to come up with.
Please consider supporting us by just disabling your AD BLOCKER and reloading this page again.
In this article let's see how to make responsive YouTube videos.
Copy the embed code of a youtube iframe
in your code and wrap a div
around it like shown in the following
<div class="youtube-video-wrapper">
<iframe class="youtube-video" src="https://www.youtube.com/embed/A_0qG-nL6Po" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
.youtube-video-wrapper {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.youtube-video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
Adding responsive YouTube videos in your website/blogs will add up lot of advantages.
I hope this article helped you. Please share it with your friends.
Install Linux, NGINX, MYSQL, PHP (LEMP Stack) on Ubuntu
Supervisor For Laravel Queue Scheduling
Send Email In PHP With PHPMailer
Comment And Like System Using Disqus
Laravel Clear Cache Of Route, View, Config Command
What Is HTTP? Different HTTP Methods And Status Codes Explained With Examples
Testing Laravel Emails With MailHog
Basic Server Security Setup For Ubuntu / Linux