Je tiens à l'échelle d'une iFrame par CSS à l' width: 100%
, et la hauteur de l'échelle proportionnellement à la largeur.
Avec un <img>
balise cela fonctionne bien.
L'image et de l'iFrame ont défini la largeur et la hauteur dans le code html.
Voici quelques exemples:
<html>
<style>
#a{ width: 500px; }
img{ width: 100%; height: auto }
</style>
<body>
<div id="a">
<img src="http://lorempixel.com/200/150/" width="200" height="150" />
</div>
</body>
Cela fonctionne très bien sur les images, mais je voudrais le même comportement pour les iFrames:
<html>
<style>
#a{ width: 900px; background: grey;}
iframe{ width: 100%; height: auto }
</style>
<body>
<div id="a">
<iframe width="560" height="315" src="http://www.youtube.com/embed/RksyMaJiD8Y" frameborder="0" allowfullscreen></iframe>
</div>
</body>
L'iFrame rend 100% de largeur, mais ne l'est pas, c'est la hauteur proportionnelle comme l'image n'.