当菜单打开时，网站缩小

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演示页面进行测试的。