三星Galaxy Mini的响应设计

Question

我正忙着使一个现有的网站响应，目前，我只是让它响应一个解决方案，以便我的销售经理可以“销售”的想法，一个响应的网站给客户。我遇到了一个问题，我被分配到480 by的屏幕大小为800 by，相当于三星Galaxy的屏幕大小。

当在我的计算机上使用firefox或其他各种在线工具中的响应设计视图测试响应设计时，它工作得很好。然而，当我在我的手机上测试它时，它会显示正确的响应设计，但它不会填充屏幕的宽度。换句话说，屏幕的宽度是480像素，但是页面上没有任何东西填充那个480 In -它只覆盖了屏幕宽度的一半，并在右边留下了空白。

这是我使用的媒体查询：

@media only screen and (max-width : 480px),
only screen and (max-device-width : 480px){

这是否与像素密度有关，或者是什么导致了这个问题？

提前感谢

亲切的问候

威廉

Answer 1

<meta name="viewport"> 

你查过这个标签了吗？这会改变布局在移动浏览器上缩放的方式。你可以看看我在这里发现的东西：tag。这个例子显示了你似乎遇到的问题。据我所知，"viewport“标签在所有移动浏览器中都有效，但是如果这对您没有帮助，您应该在手机上检查不同的浏览器。

Answer 2

当所有宽度都正常工作时，我遇到了相同的右侧白色问题，并通过关闭CSS中的溢出来解决它，如下所示.这可能隐藏实际内容，因此您必须根据您的情况/布局进行测试.

html { overflow-x: hidden; }