Full Page

J’ai l’exemple de code ci-dessous. Cela fonctionne bien avec tous les navigateurs sauf pour les navigateurs sur les appareils mobiles.

La balise de débordement est le problème.

Fonctionne avec tous sauf pour mobile:

margin: 0; padding: 0; height: 100%; overflow: hidden; 

Fonctionne avec tous les mobiles et pas les ordinateurs:

 margin: 0; padding: 0; height: 100%; 

Quelle est la meilleure façon de le faire fonctionner sur les deux?

    Test Layout  body, html { margin: 0; padding: 0; height: 100%; overflow: hidden; }       

Voici le code de travail. Fonctionne dans les navigateurs de bureau et mobiles. J’espère que cela aide. Merci à tous pour votre réponse.

    Test Layout    

C’est ce que j’ai utilisé par le passé.

 html, body { height: 100%; overflow: auto; } 

Aussi dans l’ iframe append le style suivant

 border: 0; position:fixed; top:0; left:0; right:0; bottom:0; width:100%; height:100% 

Il est pris en charge multi-navigateur et est entièrement réactif.

Mettez ceci dans votre CSS.

 iframe{ width:100%; height:100vh; }