为什么我的移动网站会向左滚动到很多空白区域

Question

我真的很难理解为什么我的网站的肖像移动版本向左滚动！

我删除了很大的标题图片，但宽度仍然滚动到屏幕右侧！

我已经在我的head标签中应用了常见的视口代码并且使用了css宽度，但无济于事。

我的网站的移动版本不应该向左或向右滚动。

关于哪些元素/ @媒体设置导致移动css出现此宽度问题的任何线索？

danieltuffour.com

非常感谢！

Answer 1

通过快速浏览开发人员面板，您现在正在使用min-width:900px，无论900px标记设置的是什么，它始终保持width的宽度。最简单的解决方法是执行以下操作：

#mediacontainer {
  min-width:100%;
  /* other css... */
}

这样，内容将始终是视口宽度的100％。现在，另一种方法是在元素上设置max-width，以防止它溢出屏幕：

#mediacontainer {
  width:900px;
  max-width:100%;
  /* other css... */
}

此方法允许您指定900像素，但如果不使用900，则会阻止它以这种方式显示。