网站在移动Firefox上水平滚动

Question

我有一个响应式网站，可以在所有桌面浏览器和移动Chrome上完美运行，无论窗口有多窄，都可以调整我想要的方式，但我在移动Firefox上获得了横向滚动。我的内容有点太大，虽然我无法想象我的CSS如何。以下是我认为相关的内容：

#main {
  width: 90%;
  max-width: 960px;
  margin: 0 auto;
}

.infoSection {
  display: inline-block;
  height: 300px;
  margin-bottom: 75px;
}

.infoSection img {
  position: relative;
  float: right;
  max-width: 50%;
  top: 50%;
  transform: translateY(-50%);
}

@media (min-width: 0) and (max-width: 470px) {

.infoSection {
    height: auto;
    margin: 0 0 30px;
}

.infoSection img {
    display: block;
    float: none;
    max-width: 80%;
    margin: 20px auto 0;
    transform: none;
}
}

关于移动设备上水平滚动的现有问题似乎都涉及将overflow-x设置为隐藏，这没有用，因为我希望我的内容能够正确调整大小。 ：/