bootstrap-responsive-video-embeds

<style>
.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
}
.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.embed-responsive.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}
.embed-responsive.embed-responsive-4by3 {
  padding-bottom: 75%;
}
</style>

<div class="container">
  <div class="row">
    <div class="col-sm-6">
   
      <h2>16:9 Responsive Aspect Ratio</h2>
      
        <div class="embed-responsive embed-responsive-16by9">
          <iframe class="embed-responsive-item" src="//www.youtube.com/embed/Dxk_wYeIv6I" frameborder="0"></iframe>
        </div>
    
    </div>
    <div class="col-sm-6">

      <h2>4:3 Responsive Aspect Ratio</h2>
    
    <div class="embed-responsive embed-responsive-4by3">
        <iframe class="embed-responsive-item" src="//www.youtube.com/embed/Dxk_wYeIv6I" frameborder="0"></iframe>
    </div>
    
    </div>
    
  </div>
</div>