Online Forum To Support Coders With Technical Assistance - Read Write Execute

How to make youtube video responsive ?

Ankit Agrawal
Ankit Agrawal
Published on January 4, 2016 · 1 min read
<style>
.videoResponsive {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}
 
.videoResponsive iframe,
.videoResponsive object,
.videoResponsive embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
</style>
<div class="videoResponsive">
	<iframe width="560" height="315" src="https://www.youtube.com/embed/8A6dW264sXM?rel=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>
</div>

Was this article helpful?
Ankit Agrawal

Ankit Agrawal

Author & Senior Engineer at CodeExecute

Writing practical engineering guides, debugging real-world bottlenecks, and creating free tools for developer productivity.

← Previous Article Apply function on parent element of iframe Next Article → Execute big select query in mysql