當菜單打開時，網站縮小

Question

我使用雅虎的PureCSS庫以及側邊欄插件，並且它在除移動Safari之外的所有瀏覽器上都能很好地工作。出於某種原因，只要打開菜單，它就會縮小。這甚至發生在文檔的example中。我不知道是什麼導致了這一點，但它很誘人，只是把它稱爲瀏覽器錯誤。

如果需要，我可以放在一起使用JSFiddle。

Answer 1

這個問題實際上歸結爲與Does overflow:hidden applied to work on iPhone Safari?相同。我想移動Safari瀏覽器會縮小，以騰出空間爲菜單和內容區域，當用戶打開的菜單，除非你做這個包裝元素上：

html, 
body { 
    overflow-x: hidden; 
} 

Answer 2

視口元標記不包含最大比例值。如果更新視口標籤以下，只要用戶點擊菜單上，你不會得到相同的變焦：

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 

注意添加maximum-scale=1到字符串的結尾。添加時，內容會滑過而不是縮小。這是針對上面鏈接的Responsive Side Menu的PureCSS演示頁面進行測試的。