将iPad从横向旋转到纵向时,页面向左移动

Jes*_*ton 7 mobile-safari orientation ipad

我正在使用CSS媒体查询来创建一个响应式设计的网站.当我在iPad上以横向或纵向打开测试页时,它看起来很好.

但是,当我从横向模式切换到纵向模式时,页面向左移动.我可以告诉正确的CSS正在加载,因为页面上的其他内容会发生变化.我也可以将页面向右拖动,如果我最初以纵向打开页面,它就会显示出来.

我的视口设置为:meta id ="view"name ="viewport"content ="width = device-width,initial-scale = 1.0,minimum-scale = 1.0"

我添加了JavaScript来修复iOS视口缩放错误,该错误用于在从纵向切换到横向时将页面放大.(我使用了这里描述的解决方案:https://gist.github.com/901295)

我在查找从横向切换到纵向时遇到的错误的名称时遇到问题.有没有其他人看过这个或知道如何解决?

ell*_*son 3

我设法解决了类似的问题 - 也许这对你有用?

您需要通过删除/恢复不同的位并重新测试页面来确定是否是特定的 div 或其他元素导致的。一旦你解决了这个问题,请尝试overflow: hidden在 CSS 中向该元素添加一个属性 - 我使用它是overflow-x: hidden因为我的问题是水平滚动,但你可能需要改变它。

希望这有用...祝你好运!