<span>Resize the browser to see how the video is kept at 16:9.</span>
<div class="box">
  <iframe class="content" src="https://www.youtube.com/embed/pU9Q6oiQNd0" frameborder="0" allowfullscreen></iframe>
</div>
.box {
  position: relative;
  padding-top: 56.25%;  /* 9/16 = 56.25 */
}

.box > .content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
// Does not need any javasript :D

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.