Question

当我缩小浏览器窗口的宽度（Firefox v26）以便只显示我主页的1/2时，水平滚动条会出现在浏览器的底部，这很好。

但如果我滚动页面看到它的右半部分 - 右半部分是空白的。换句话说，在向右水平滚动（显然向左移动页面内容）后 - 页面右侧不会重绘。它保持空白。即使我点击浏览器URL栏上的刷新。

我环顾四周，发现了几个帖子。 This one似乎完全同样的问题（唯一不同的是，他们涉及垂直滚动条）。

所以我在那里提出了建议 - 这是设置我的最外层内容div（在下面的代码中称为 wholePageDiv ）以及我的 outerDiv 到'min-width ：100％“但这没有改变。

这是非常简单的代码：

 <html>
  <body>
    <div id="wholePageDiv" class="wholePageDivForCentering"> 
      <div id="outerDiv" style="margin: 0; margin-top: 10px; min-width: 100%; 
              display: inline-block; overflow: hidden">

          (not shown:  a bunch of divs with text)
      </div>
    </div>
  </body>
 <html>

这是 wholePageDivForCentering CSS类，根据我读过的SO帖子进行了更改：

  .wholePageDivForCentering
   {
      /* width: 100%; */
      min-width: 100%;
      /* height: 100%; */
      min-height: 100%;
      white-space: nowrap;
      margin: 0 auto;
   }

我查看了其他网站，看看他们是否展示了相同的“滚动页右侧不重绘”问题。在我测试的其他网站上，我将浏览器缩小到显示整页所需宽度的1/2，然后我滚动查看页面的右半部分 - 我检查的所有其他网站都成功重绘了右侧我滚动的内容。

我上面有CSS样式问题吗？

编辑：我在浏览器中点击F12并使用'Inspector'工具，我清楚地看到唯一可见的内容在 wholePageDiv 内，而且这个div是不是当我向右滚动时，向右扩展 - 检查器显示无论出于何种原因，我最外面的 wholePageDiv 保持与视口相同的固定大小，当我滚动到右侧时，Inspector显示的这个视口轮廓只是向左移动而不是在右侧展开以适应向右移动滚动条。

Answer 1

我已经将你的html和css添加到了一个小提琴中，它对我来说很好。显示div的文本没有问题：http://jsfiddle.net/micahSan/UucLB/3/

same code as the OP

你能用小提琴复制你的问题所以我们都能看到它吗？

Answer 2

我通过硬编码div的宽度，或者通过以编程方式增加div的宽度来解决这个问题（现在），因为浏览器窗口/文档的宽度已经改变。希望以后能找到一个不那么笨拙的解决方案。

页面不在水平滚动上重绘

2 个答案: