Chrome CSS背景图像显示为白色区域

我有一个神秘的（至少对我来说）css背景图像问题，我只在谷歌Chrome上遇到过。我发现了类似的主题，但与之不同的是，这里没有涉及Javascript、JQuery或其他任何内容，它是纯CSS。它只是没有发挥应有的作用

如果打开www.bodrogietterem.hu页面，背景图像应位于整个内容区域的下方（与其他浏览器一样）。在Chrome中，会出现水平和垂直的白色区域

一旦你开始滚动，背景图像就会显示得很好，从那时起它就一直保持在那里。类似地，当您使用inspect元素打开dev工具时，背景图像立即出现在那里，并且也保持在那里

以下是相关css：

body.page-node-1  div#main{
background:#FFFFFF url('/sites/all/themes/bodrogietterem/images/bodrogi_bodrogi.jpg') bottom;
background-repeat:no-repeat;
background-attachment:fixed;
background-position:50% 135px;
padding-bottom:0px;
margin-bottom:0px;
}

并附上两个屏幕抓图，说明它的外观和应该的外观（作为新用户，我不允许附加这些内容，但请看这里：

这里呢

它也发生在子页面上，但我认为问题的根源一定是相同的

我使用的是Vista、最新的Chrome（20.0.1132.57）和最新的其他浏览器。顺便说一句，第二个屏幕截图也是在Chrome中拍摄的，但是在打开开发工具之后

非常感谢你的帮助， 最好的，

---

Zsolt

Chrome的最新版本是21.0…因此请尝试更新Chrome浏览器，看看它在最新版本中是否正常。屏幕截图会导致404错误页面，因此请再次尝试上载屏幕截图

---

我还检查了IE7、IE8、IE9中的页面。该页面在所有3个页面中看起来都很好，但IE7底部显示了一个水平滚动条，但背景图像看起来不错。

您的页面在windows 7的Chrome中看起来很好（Chrome 20.0.1132.57）

我以前遇到过一些问题，安装的各种工具栏/插件会干扰页面上的CSS，这会使Chrome在孤立事件中出现问题。尝试在没有安装插件/插件的情况下运行Chrome，看看它是否能解决您的问题

对CSS的一个观察：

#content

包含未清除的浮动元素。我认为这不是问题所在，但可能与上述内容混合

---

如果有帮助，请告诉我。

谢谢你的帮助，我终于解决了问题

在摆弄的时候，我测量了白色区域的高度，结果是135px（这正是上面CSS中背景的顶部位置）。所以我决定，不管出于什么原因，这个属性导致了问题，我是对的

作为一个快速而肮脏的解决方案，我在背景图像的顶部添加了135px的白色区域，并将background position属性的top设置为0px，这立即解决了这个问题

至于垂直白色区域，它是通过将背景图像绑定到#main wrapper div而不是#main div（它是Drupal 7构建）来解决的。同样，我不知道为什么，但它立即解决了问题

我喜欢网络的精确性和逻辑性，它有时仍然是随机的和临时的

再次感谢你的时间和努力，贝斯特，

---

Zsolt在两页的内容上也有同样的问题，但我想我在阅读了你上面的文章并思考了一下之后解决了这个问题

问题可能出在一般背景中：url；网站css的属性和加载。我替换了所有一般背景：#222222 url重复等；对于背景图像：；，背景重复：；和背景颜色：；等

请让我知道，如果你的网站工作后，编辑你的css。我仍在测试

---

欢迎，aquaster.nl

截图产生了400个错误请求。我在Firefox、Chrome和IE中打开了你的页面，它们看起来都一样：滚动条对我来说根本不起作用。嗨，大卫，滚动条不起作用，因为我当时正在处理css：-）现在应该没问题了，我修复了屏幕截图URL，将它们上传到我的服务器我在Chrome上看到过类似的bug，这是由于BitTorrent工具栏等插件造成的。嗨，Raj，我已经在运行了安装程序，但我得到了与以前相同的版本（20.0.1132.57）。关于菜单还说浏览器是最新的，你从哪里获得v21？大卫，卷轴不起作用，因为我在网站上乱搞css-现在应该没事了。还有其他想法吗？嗨，大卫，谢谢你的提示，但不幸的是，它对我不起作用。我没有BitTorrent工具栏，在禁用所有扩展后，问题仍然存在。无论如何，我设法解决了这个问题（见下面的答案），尽管我仍然不确定最初是什么原因造成的。再次感谢你，Zsolt