移动设备上的侧滚动答案

【问题标题】：Side scroll on mobile devices移动设备上的侧滚动
【发布时间】：2013-02-24 04:02:56
【问题描述】：

我在移动设备上看到一些令人讨厌的侧滚动。我有两个@media 查询集，平板电脑和移动设备。

dev.bdbshop.com

@media only screen and (max-width: 767px) {
.wrap { max-width: 300px; }

这是问题吗？有没有更好的方法来做到这一点，例如使用百分比？

我应该添加第三个@media 查询并设置更具体的百分比吗？目前只有 2 个断点比较宽。

【问题讨论】：

标签： css mobile responsive-design

【解决方案1】：

我已经检查了你的代码<div id="sidebar-footer" class="sidebar"> 你知道这个元素的确切宽度是多少？你已经提到它的宽度超过了视口 100%。

#sidebar-footer { clear: both; margin-bottom: 0; margin-left: auto; margin-right: auto; margin-top: 0; overflow-x: visible; overflow-y: visible; width: 104.255%; }

使用 100% 而不是 104.255% 。它可以正常工作。

【讨论】：

就是这样。不知道我是怎么错过的。谢谢！
我现在在内部帖子页面上看到更大的侧滚动问题。一切都在左边距浮动，但右边的想法有很大的填充问题？

【解决方案2】：

后续问题，您个人认为添加另一个低于 767px 的#media 屏幕断点是否值得？例如旧手机和 iPhone 的 320 像素？

【讨论】：