CSS：水平滚动时没有背景

好的，我的背景设置如下：

HTML 所以我们的想法是将内容放在一个800px的盒子里，而内容的背景是100%，我对不同的区域有相同的设置，比如页眉、页脚和页面的主要部分。所以他们都有着100%的不同背景，而内容都在一个800像素的盒子里

所有这些都可以很好地工作，直到你使窗口小到足以显示一个水平滚动条，然后当你水平滚动时，显示的部分不再有背景，但是如果你使页面更宽，那么背景就在那里

你可以在这里看到：

有办法解决这个问题吗

---

谢谢

既然您使用的是固定宽度的内容区域，为什么不给您的#容器（实际上是您站点上的#内部#内容#容器）一个固定宽度呢？因为你的图像是824px宽，所以我用FireBug把你的容器做成这个宽度，你的问题就解决了

注意：执行此操作时，如果不需要滚动条，还需要为容器设置自动边距，并将溢出设置为隐藏

#container {
  margin:auto;
  overflow:hidden;
  width:824px;
}

---

我发现（或者看起来）当你滚动时，只有

#content

的背景“暴露”了，而不是

#container

的背景。因此，我所做的是将

#content

设置为与

#container

具有相同的背景。这解决了问题，而不必使滚动条显示为非内容。

这将使视口必须为824宽才能不显示滚动条，我希望分辨率为600x800的人在最大化时不要仍然有水平滚动条。但是你确实给了我一个想法，修复了它，对于页眉和页脚，我将内容设置为与容器具有相同的背景，对于主部分，我只是将其设置为具有白色背景。这个修正了：）我想你也可以使用overflow:hidden（我更新了我的答案）。不管是哪种方式，我都很高兴你能找到答案。@easwee你不能接受自己的答案，除非你问这个问题已经两天了。我也更愿意标记别人的答案，而不是我自己的答案。因此，我想给某人一个机会，要么给出比我更好的答案，要么扩展我的答案，这样我就可以给他们打分了。：）

#container
{
    background:url(image.gif);
}
#content
{
    width:800px;
    margin:auto;
}

#container {
  margin:auto;
  overflow:hidden;
  width:824px;
}