我正在開發一個可在iPad的Mobile Safari和標準PC瀏覽器上進行可視化的網站。在這個頁面基本上使用CSS3的媒體查詢時的移動Safari重熔錯誤
@media only screen and (max-width: 980px), only screen and (max-device-width: 1185px) { #galleria { margin-left:5%; margin-top:15%; } } @media only screen and (max-width: 1185px), only screen and (max-device-width: 980px) { #galleria { margin-left:16%; margin-top:15%; } }
這種方法的工作原理,但是當我轉動我的設備,蟲子出來 : 要適應我的佈局(尤其是在手機瀏覽器,我使用這個CSS3媒體查詢。有一個名爲「標誌」表示的圖像,下面是它的CSS:
#logo { position:absolute; top:30px; left:26%; } #logo img { width:75%; }
此圖片每次我旋轉設備的時間,變得更小 我怎樣才能避免這種錯誤 感謝所有的?答案!
你使用什麼元視口? – mddw 2013-02-14 13:11:31
– PeppeLaKappa 2013-02-14 13:12:56
這可能是着名的方向錯誤(http://webdesignerwall.com/教程/ iphone-safari-viewport-scaling-bug/comment-page-1)你能否提供一個例子或截圖? – mddw 2013-02-14 13:15:01