CSS Background image arbitrarily not getting requested at all
- by Pekka
I`m in the process of building a template for Redmine (a project management system based on Ruby on Rails.)
Ruby is running on a virtual server from a Bitnami.org installation package. The OS is Windows.
The template essentially consists of a styles.css file. In that file, I have the following line:
#header { padding: 0px; padding-top: 48px; background-color: #62DFFF;
background-image: url(../images/bkg.jpg);
background-position: center bottom;
background-repeat: repeat-x;
height:150px; }
It's a header element with a background image.
The problem: This background image arbitrarily appears and disappears when reloading the page. It is more often missing than it is not. Say you reload the page in your browser ten times in twenty seconds; the image will appear in two instances, and be missing in the 18 others.
I would have put this down to server problems, but the weird thing is that when it's missing, the request for the image doesn't appear in Firebug's net tab at all. Even if it were cached, the request should be there, shouldn't it? Raw screenshots of the identical page on two reloads:
I am 100% sure the CSS file does not change in between. I have examined both instances with Firebug and the CSS is identical.
When I change the image's URL by editing the style declaration in firebug to bkg.jpg?xyz=123445 then the image will get loaded, which is making me think this must be a server problem.
It happens in both Firefox and Chrome so it must be something basic I'm overlooking.
What could be causing a browser not to load a resource at all?
I have zero idea about Ruby nor Rails - getting Redmine running and customized is all I have ever had to do with this platform - so I don't really know where to start debugging. Apache's, Mongrel's and Redmine's error logs look fine, though. And then again, this looks like a browser issue. I'm stumped.