我正在忙着使现有网站响应，目前我只是让它对一个分辨率做出响应，这样我的销售经理就可以向客户“销售”响应式网站的想法。我遇到了一个问题，我被分配了480px×800px的屏幕尺寸，三星Galaxy S III Mini的屏幕尺寸。
使用firefox或其他各种在线工具中的响应式设计视图在我的计算机上测试响应式设计时，它运行正常。但是，当我在手机上测试它时，它会显示正确的响应设计，但它不会填满屏幕的宽度。换句话说，屏幕宽度为480像素，但页面上没有任何内容实际填充480px，它只覆盖屏幕宽度的一半左右，并在右侧留下空白区域。
这是我正在使用的媒体查询：
@media only screen and (max-width : 480px),
only screen and (max-device-width : 480px){
这是否与像素密度或导致此问题的原因有关？
提前致谢
亲切的问候
威廉
答案 0 :(得分：0)
<meta name="viewport">
你看过这个标签了吗？这会更改布局在移动浏览器上缩放/缩放的方式。您可以查看我在此处找到的内容：https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag。此示例显示您似乎遇到的问题。据我所知，“viewport”标签适用于所有移动浏览器，但如果这对您没有帮助，您应该检查手机上的不同浏览器。
答案 1 :(得分：0)
当所有宽度都正常工作时，我遇到了相同的右侧白色问题，并通过关闭CSS中的溢出来解决它...这可能会隐藏实际内容，因此您必须根据您的情况/布局进行测试。 ..
html { overflow-x: hidden; }