Mam przykładowy kod poniżej. Działa to poprawnie ze wszystkimi przeglądarkami z wyjątkiem przeglądarek na urządzeniach mobilnych.
Problemem jest z tagiem overflow.
Działa ze wszystkimi oprócz telefonów komórkowych:
margin: 0; padding: 0; height: 100%; overflow: hidden;
współpracuje ze wszystkimi urządzeniami mobilnymi, ale nie komputerowymi:
margin: 0; padding: 0; height: 100%;
Jaki jest najlepszy sposób, aby działało to na obu urządzeniach?
<!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>
1 odpowiedź
Oto działający kod. Działa w przeglądarkach stacjonarnych i mobilnych. mam nadzieję, że to pomoże. dzięki za odpowiedź.
<!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;
}
#content
{
position:absolute; left: 0; right: 0; bottom: 0; top: 0px;
}
</style>
</head>
<body>
<div id="content">
<iframe width="100%" height="100%" frameborder="0" src="http://cnn.com" />
</div>
</body>
</html>