How to Make Youtube Video Responsive on Blogger

There are many bloggers who embed youtube videos on their blogs. Whenever you embed youtube iframe on your blog, you have to choose the standard sizes for the player or to enter your custom width and height. Many visitors on BT9 asked us to share some tips to make youtube videos responsive. Simply follow below instructions and your youtube videos will work best on any screen size.

How to make embedded Youtube video responsive on any resolution

Sharing videos on your website is a big source to gain traffic. You can easily upload your tutorial on youtube and share them.
Youtube Vector
Search for paste below css code above it.
/* Youtube Responsive css */ .v-wrap {position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; margin:12px 40px;} .v-wrap iframe, .v-wrap object, .v-wrap embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;} .entry-content img, .entry-content iframe, .entry-content object, .entry-content embed {max-width: 100%;} Copy and paste below code inside your post area.
<div class="v-wrap"><iframe allowfullscreen="" frameborder="0" height="340" src="" width="565"></iframe></div>

Subscribe for our Newsletter

Back to top