Responsive with aspect ratio on embedding video

Embedding a video to oursite can be tricky. This code will the embed video on your site responsive, while maintaining the aspect ratio

.video {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
}
.video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
Posted in CSS

Leave a Reply

Your email address will not be published. Required fields are marked *