【发布时间】：2015-09-14 22:51:47
【问题描述】：
我正在尝试将设计不佳的模板转换为响应式设计，可在此处找到：http://www.crhinc.com/about-mobile.html
我遇到了一个问题，在桌面浏览器上调整为移动设备的模板看起来和工作得很好，但在 android 和 iphone 上，页面大于视口。我知道我一定遗漏了一些东西，但是正如你所看到的，我已经概述了这些元素，只是为了尝试看看我是否可以找出将其拉伸到视口之外并导致手机从一侧滚动到另一侧的内容但不是桌面浏览器。
我将 body 设置为 300px 宽度，只是为了看看我是否能找到流氓元素，但因为它不起作用，所以把它放回去了。内容中有几个表格，但都设置为 100% 宽度。
由于某种原因，它几乎看起来像桌面和手机上的宽度，或者实际上并不相同。
杰夫
【问题讨论】：
-
寻求调试帮助的问题（“为什么这段代码不起作用？”）必须在问题本身中包含重现它所需的最短代码。尽管您提供了一个示例链接，但如果该链接失效，您的问题对于未来遇到相同问题的其他 SO 用户将毫无价值。
-
感谢您的回复，以便我可以更正此问题以获得未来的帮助，我是否应该复制所有代码，包括整个 html 页面和 css？我很想来一个。帮助其他可能正在寻找答案的人，以及 b.帮助自己不要被这样标记。
-
查看正文...“重现它所必需的最短代码。”
-
您只有一个媒体查询，为 400 像素及以下的手机再创建一个。并删除你的 div 包装器。
-
我把它增加到 500 只是为了解决问题，如果我删除包装 div，表格会在桌面模式下全屏显示。我该如何解决？
标签： css mobile responsive-design viewport