javascript - "width=device-width"并不总是适用于移动 safari 的固定大小布局?

标签 javascript html css mobile-safari viewport

我有一个固定宽度的布局,它的视口(viewport)属性设置为:

<meta name="viewport" content="width=device-width">

因此,即使我的固定布局宽度比设备宽度宽,我也希望呈现的页面适合设备宽度。

我知道 initial-scale=1 属性,但我不需要它,因为我的布局不流畅。

我的问题是,为什么当页面内容的高度不足以滚动时,width=device-width 在移动 safari 上不起作用:

JSBIN Example 1

...当内容的高度足够长以至于您必须滚动时它会起作用:

JSBIN Example 2

PS:我知道在两个页面上放置 width=my-fixed-width 甚至删除所有视口(viewport)设置应该可以解决问题。我的问题是为什么会出现上述情况?

最佳答案

HTML 和 CSS 是很奇怪的东西。 似乎规则“宽度 > 高度”在起作用

关于javascript - "width=device-width"并不总是适用于移动 safari 的固定大小布局?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26544185/

相关文章:

javascript - JQuery DefinitelyTyped、typescript 1.4 和 Webstorm 错误突出显示

javascript - 在 Ionic 2 中链接到带有附加跟踪代码的外部 URL

c# - DropDownList 中的中心元素

javascript - 无法在同一调用堆栈中的转换之前动态设置初始元素转换

Javascript 匹配正则表达式链接

javascript - 从 &lt;input type ='file'> 获取值返回空字符串

javascript - 元素后的 HTML 脚本标签

html - 导航菜单仅在 Safari 中显示为同时按下。想法?

html - 使用 Bootstrap 的 iOS 复选框不会居中

html - 添加背景图片时不会出现 CSS 悬停效果