Comment Faire iframe 100% de la hauteur en fonction de son contenu

J'avais vu beaucoup de gens qui demandent comment faire iframe 100% de la hauteur. Qui peut facilement être archivés à l'aide de CSS. Il fera l'iframe d'affichage de 100% par rapport à l'écran de l'appareil. Mais comment faire iframe 100% de la hauteur en fonction de son contenu?

Voici mon code actuel, de faire 100% de l'iframe en fonction de l'écran du périphérique:

CSS:

        iframe {
        display: block;
        background: #000;
        border: none;
        height: 100vh;
        width: 100vw;
    }

HTML:

    <iframe src="https://...">Your Browser Does Not Support iframes!</iframe>

La allowfullscreen et position:absolute n'aide pas, sauf pour le fracas de mon site modèle. C'est le mieux que je puisse faire sans le fracas de la primaire CSS. S'il vous plaît aider...

Edit: Le contenu de l'iframe est réactive à l'aide de

<meta name="viewport" content="width=device-width,initial-scale=1">

afin de hauteur prédéfinie à l'aide de javascript ne fonctionne pas trop. Peut-être est-il un moyen de l'utilisation d'unités de hauteur à la place?

em, ex, rem etc? Ou faire un pourcentage spécifique de vw?

  • cela fonctionne pour moi dans la dernière version de chrome. Quel navigateur utilisez-vous?
  • Je suis en utilisant google Chrome et Safari
InformationsquelleAutor Anthony Kung | 2018-03-13