html - 在 iPad / iPhone 上 CSS 显示不正确

Question

我有一个正在开发的网站，我的客户已经提醒我有一个问题 - 它无法在 iPad / iPhone 上正确显示。Chrome / FF / Safari（在 PC 上）都显示正确。

该网站是http://xprotect.co.nz

右侧下方有一条黑色条带，是body标签的背景色。它也显示在底部。

我已经设法让 Firebug lite 在 iPad 上工作（因为使用开发人员工具的 Safari 中没有显示问题 - 使用 iPad 作为屏幕代理）。我可以看到问题的根源——但看不到问题的根源。

iPad 上的 Firebug 告诉我，两个容器 div（outerContainer 和 middleContentOuter）的计算值为 980 像素，而每个容器中的居中 div 的宽度为 1000 像素。所以我实际上在右侧丢失了 20 像素 - 某些原因导致这些容器 div 减少了 20 像素，即使每个 div 的指定宽度为 100%。

谁能发现我看不到的东西 - 或提供任何建议？

非常感谢，

托比。

Answer 1

您需要在 css 中设置 min-width：

 .outerContainer, middleContentOuter{
      min-width: 1000px;
 }