J'ai l'exemple de code ci-dessous. Cela fonctionne bien avec tous les navigateurs, à l'exception des 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 ordinateurs mobiles et non:
margin: 0; padding: 0; height: 100%;
Quelle est la meilleure façon de faire fonctionner les deux?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test Layout</title>
<style type="text/css">
body, html
{
margin: 0; padding: 0; height: 100%; overflow: hidden;
}
</style>
</head>
<body>
<iframe width="100%" height="100%" src="http://www.cnn.com" />
</body>
</html>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
à la tête du html contenant et la réactivité est de retour (au moins partiellement).
cnn.com
?