mobile-safari - 打开菜单时网站缩小

Question

我正在使用 Yahoo 的 PureCSS 库以及侧边栏插件，它在除移动 Safari 之外的所有浏览器上都运行良好。出于某种原因，只要打开菜单，它就会缩小。这甚至出现在文档的示例中。我不知道是什么原因造成的，但很容易将其称为浏览器错误。

如有必要，我可以组合一个 JSFiddle。

Answer 1

视口元标记不包含最大比例值。如果您将视口标签更新为以下内容，则无论何时用户单击菜单，您都不会获得相同的缩放：

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

注意添加maximum-scale=1到字符串的末尾。添加后，内容会滑过而不是缩小。这是针对Responsive Side Menu的PureCSS演示页面进行测试的，链接到上面。

Answer 2

这个问题实际上归结为与是否溢出相同：隐藏应用到 iPhone Safari 上工作？. 我猜当用户打开菜单时，Mobile Safari 会缩小为菜单和内容区域腾出空间，除非您在包装元素上执行此操作：

html,
body {
    overflow-x: hidden;
}