iphone向下滚动页面,其中包含水平滚动元素

时间:2017-12-20 18:57:58

标签: html css iphone scroll

我有一个页面,它有一个水平滚动元素(一行可以向侧面滚动的图像),非常简单。
我的问题是在iPhone上,如果我尝试垂直滚动页面并从水平滚动元素的区域开始滚动,页面不会滚动。

在Android设备上它工作正常,任何想法为什么会发生这种情况以及如何解决这个问题?

更新 我找到了罪魁祸首我的主题css有以下html,body {height: 100%;},我仍然有兴趣理解为什么它会导致这个以及如何在不删除该行的情况下修复它,(我没有设计主题并且无法确定那css是没有必要的)

div {min-height: 2000px}
ul {white-space: nowrap; overflow-x: scroll;}
li {display: inline-block; margin: 5px; background: #555;}
html,body {height: 100%;}
<div>
stuff<br> stuff<br> stuff<br> stuff<br>
<ul><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li><li>side sliding elemntts</li></ul>
stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br> stuff<br>
</div>

1 个答案:

答案 0 :(得分:2)

您必须确保未设置html的{​​{1}}和body样式