Scalable iframe with reproCSS

index.html

<h1>Scalable iframe</h1>

<iframe id="demo" width="560" height="315" src="https://www.youtube.com/embed/XreMtQz6HkY" frameborder="0" allowfullscreen></iframe>

<style process="load resize">
  #demo {
    width: 100%;
    height: calc(${document.querySelector('#demo').offsetWidth}px / (${demo.width}/${demo.height}));
  }
</style>

<footer>Built with <a href=https://tomhodgins.github.io/reprocss/>reproCSS</a> </footer>

scalable-iframe-with-reprocss.markdown

Scalable iframe with reproCSS

A Pen by Tommy Hodgins on CodePen.

License.

scripts

<script src="//rawgit.com/tomhodgins/reprocss/master/reprocss.js"></script>