How can I make my video responsive?

We recommend wrapping the Distrify player in <div> element, and using CSS to make the player responsive, adjusting it's size for different layouts and device classes.

<style type="text/css">
  .distrify-iframe-container {
    width: 100%;
    height: 0;
    padding-bottom: 56.25%; // Assumes a 16:9 aspect ratio, as all Distrify embeds are.
    position: relative;
  }
  .distrify-iframe-container > iframe {
      height: 100%;
      width: 10px;
      min-width: 100%;
      position: absolute;
      left: 0;
      top: 0;
      border: none;
    }
</style>


<div class="distrify-iframe-container">
  <iframe src="https://embeds.distrify.com/player/9jCMXc" width="640" height="360" frameborder="0" scrolling="no" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</div>

Still need help? Contact Us Contact Us