视口和CSS媒体查询获得不同的宽度？

Question

我在为智能手机创建css媒体查询时遇到问题，特别是对于三星Galaxy S3等Android设备。

似乎<meta name="viewport" content="width=device-width, initial-scale=1.0" />和CSS媒体查询在设备宽度上获得不同的数据。

如果我在纵向模式下持有我的Galaxy S3，它的屏幕是720 x 1280，而且来自meta视口的content="width=device-width似乎给了我相同的宽度。

但是，如果我在横向模式下查看相同的页面，似乎来自元视口的content="width=device-width在听取更大尺寸的媒体查询时仍然给我720宽度，可以说是1280。

这会导致网页加载一个稍微放大的视图，可能是因为它认为720是最大宽度。

检查屏幕：

Galaxy S3 Portrait（Chrome）

Galaxy S3 Landscape（Chrome）

上面是使用Chrome浏览器在三星Galaxy S3上测试的。

我有一个类似的问题，实际上更糟糕的是默认的Android浏览器叫做“Internet”。在那里它似乎忽略了所有CSS媒体查询，同时仍然在监听视口。

检查屏幕：

Galaxy S3 Portrait（默认）

Answer 1

尝试使用手机中的检查器来播放值和标签或向我们发送演示。如果没有任何代码附加到您的问题，很难指出确切的问题。