移动设备上不需要的水平滚动 space

Question

我正在使用 Bulma CSS 框架构建此网站 http://104.236.64.172:8081（可能无关紧要）。该网站响应迅速，除了一个我无法修复的小问题外，在移动设备上整体看起来很棒。

如果您在手机上打开此 link phone，您会看到右侧有一些不需要的水平 space。有点像一些备用 margin-right。但问题是我无法在我的桌面上调试它，因为它似乎不会出现在小宽度的大屏幕上。你能帮我调试一下吗？

Answer 1

我能够通过隐藏 cont class 上的 overflow-x 来解决问题。

例如：

.cont {
    max-width: 1110px;
    margin: 0 auto;
    overflow-x: hidden; /* THIS */
}

我尝试在 cont 的子项 classes 上添加相同的实现，但它似乎没有像在其父项中那样解决问题。如果有人有更好（或更安全）的解决方案，请随意使用它而不是这个，因为这可能会在以后产生不必要的影响。

另外，作为一个提示，您应该能够使用网络浏览器的（在我的例子中 Chrome）检查功能，以便在移动设备上使用网站进行重现。 Here's a quick walkthrough.

Unwanted scrollable horizontal space on mobile devices