2013-01-02 76 views
0

当由铬,野生动物园,火狐& IE认为这一看起来很好。与移动浏览器股利布局变化

当手机上的Android手机看风景看起来好像没什么,查看纵向和列表重叠容器的底部。

为什么以及如何解决?

<style> 
div.test {color:black; text-align:left; border-radius:15px; -moz-border-radius:15px; border:2px solid #000; background-color:#808080; } 
ul#navlist {width:80%; \width:80%; w\idth:80%; padding:15px; border-top:0px; margin:0px; color:#ffffff; font:10pt verdana,helvetica,arial,sans-serif; } 
ul#navlist li {list-style:none; } 
ul#navlist li a {display:block; padding:4px 8px 4px 8px; border-left:20px solid #808080; background:#808080; text-decoration:none; text-align:left; font:bold 10pt verdana,helvetica,arial,sans-serif; } 
ul#navlist li a:link {color:#fff; } 
div#nav li a:visited {color:#fff; } 
ul#navlist li a:hover {border-color:#fff; color:#ffffff; background:#202020; } 
</style> 

<div class="test" style="position:absolute; top:30px; left:10px; width:485px; height:580px"> 
<div id="nav" ><ul id="navlist"><b>&nbsp;&nbsp;DEMO</b> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
<li><a href="#">TEST Entry</a></li> 
</ul></div></div> 

回答

0

你必须写景观2个CSS 1和1肖像,只是复制粘贴下面的代码,这将是工作的罚款 META NAME =“苹果移动网络应用能力”的内容= “是”/>

meta name="apple-mobile-web-app-capable" content="yes" /> 
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=0;" /> 
<link rel="stylesheet" media="all and (orientation:portrait)" href="../../../css/potrait.css" /> 
<link rel="stylesheet" media="all and (orientation:landscape)" href="../../../css/landscape.css" /> 
+0

千万不要这么想! 谢谢 – JeffVader