为什么Galaxy Nexus / Android 4上的视口标签不起作用?

我正在开发一个webApp,它应该调整到设备可能具有的任何屏幕尺寸。 在iOS和较旧的Android版本上,视口标记工作正常。 屏幕上的图片始终resize以适合屏幕。
(如下所述: https : //developer.apple.com/library/ios/#DOCUMENTATION/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html#//apple_ref/doc/uid/TP40006509-SW19 )
在Galaxy Nexus(Android 4.0)上它无法运行。 在左侧和右侧约20px空间,我不知道他为什么这样做。 我的viewport标签如下所示:

 

无论我对标签做了什么改变,空间总是存在,内容不适合屏幕。 我已经制作了一个示例页面来向您展示效果: http : //easyeve.w3y.de/link/index.html
如果您在iPhone上打开此链接,内容完全适合(您将看不到任何黄色=正文),文档宽度为320px。 在Galaxy Nexus上,您将看到黄色空间,文档宽度为360px(正好是显示分辨率的一半)。 这应该是320px! 你有这个问题吗?有办法解决它吗?

更新:我在Galaxy Note / Android 2.3.6上发现了同样的问题因此它不是Android 4的问题。 它与我猜的大屏幕尺寸有关..

同样的问题(Galaxy Nexus – Android 4.0.2),我说的是默认浏览器中的常规网页

浏览器似乎忽略了将viewport meta initial-scale设置为小于1(缩小) 。 高于1(放大)的值可以正常工作。

浏览器中有一些设置(设置 – >高级),您可以在其中更改内容:

  1. 默认缩放 – 它有所不同,但它不能解决问题
  2. 自动调整页面 – 在我的情况下没有任何区别

一切似乎都在Chrome浏览器中完美运行(目前为测试版),但这不是 ICS / Galaxy Nexus的默认浏览器。

更新(解决方案):

在Galaxy Nexus上设置元视口“width = device-width”失败。
设置视口“width = 1280”效果很好 (1280px是galaxy nexus屏幕的宽度)。

请注意,设置“width = 1280,user-scalable = no”会再次打破它(即使有用户可伸缩=否,你也可以缩小):(

我在Galaxy Tab 2上碰到了类似的东西。在为应用程序设置WebSettings时,尝试设置webViewSettings.setUseWideViewPort(true); 这将迫使Android考虑视口元标记。 对于我的应用程序,Galaxy Tab 2的情况被忽略了,视口中的所有内容都被错误地绘制,直到我更改了它。

我今天最终在争论这个问题。 我的问题有点复杂,因为除了基本CSS之外我还必须处理Wordpress样式表(来自另一个主题)。 Chrome在我的手机和平板电脑上完美运行,平板浏览器也在平板电脑上运行良好。 但是,股票浏览器不断缩小并向我显示桌面视图。 两边都没有边距,这是正确的行为,但浏览器应该从我的侧边栏和内容div中删除浮动并放大到主要内容(我正在使用@media查询)。 听起来很奇怪,我实际上通过首先将“缩放”设置设置为“远”,“刷新”,然后将“缩放”重置为“中”并刷新来修复此问题。

我应该指出,当我查看您的页面的HTML和CSS时,我注意到您为页面div设置了特定的像素宽度。 我很确定你需要使用百分比代替宽度。 例如,我的居中内容div有margin: 0 auto;min-width:320px;max-width:900px;width:100%;