Check it out:
I have successfully reproduced the issue.. on the external page (test.php linking to test.css) you will see an extremely simple html page. There is one div with one image in it. It has a css style applied to it but the background (which is a couple of dropshadows) is missing.
In the second set of pages (test2.php and test2.css), the ONLY difference is that the style properties have been moved inline, everything else is IDENTICAL, but the styling now works.
How come? I’ve seen this situation many times before but people always like to claim that “there is obviously some overriding styling somewhere that you just forgot about or aren’t noticing” but in this case I have gone out of my way to show that there is no overriding styling.
Yet it’s browser independent and consistent so I’m sure there is a simple answer.
Relative paths in external CSS files need to be relative to the CSS file, not the page.