Responsive Youtube Video, IFRAME, EMBED, or OBJECT

add wrapper tag to oembeds.php

<?php
add_filter('embed_oembed_html', 'my_embed_oembed_html', 99, 4);
function my_embed_oembed_html($html, $url, $attr, $post_id) {
  return '<div class="video">' . $html . '</div>';
}
?>

Responsive Youtube Video, IFRAME, EMBED, or OBJECT.md

Responsive Youtube Video or IFRAME, EMBED, OBJECT, etc.

## SASS ```sass // If using more than a single column, TWO containers are requird like so; // Jeet Mixins col(); // Custom media query mixin tabet(); .video-wrapper-col { @include col(1 / 2); @include tablet { @include col(1 / 1); } }

.video { position: relative; overflow: hidden; height: 0; padding-top: 30px; padding-bottom: 56.25%; }

.video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

<br>

## HTML
```html
<div class="video">
             <iframe src="http://www.youtube.com/embed/jh123871h23871gf" frameborder="0" width="560" height="315" allowfullscreen></iframe>
</div>

<div class="page-container">
  <!-- column one -->
  <div class="video-wrapper-col">
    <div class="video">
      <iframe width="100%" height="306" src="http://www.youtube.com/embed/jh123871h23871gf" frameborder="0" width="560" height="315" allowfullscreen></iframe>
    </div>
  </div>

  <!-- column two -->
  <div class="video-wrapper-col">
    <div class="video">
      <iframe width="100%" height="306" src="http://www.youtube.com/embed/jh123871h23871gf" frameborder="0" width="560" height="315" allowfullscreen></iframe>
    </div>
  </div>
</div><!-- .page-container -->