The Problem
I associated a background image with a DIV tag (in the style of the DIV), like this:
<style>
.r3c1 {
background-image: url(orange slash_r3_c1.jpg);
background-repeat: repeat-y;
}
</style>
...
<div class=r3c1>lines of stuff...</div>
This worked for Internet Explorer, but the image just would not display on Mozilla or Opera browsers!
In finally figured out the problem. It was because the image filename had a space character in it! That is just fine with IE, but not with the other browsers.
The Solution
I simply renamed my images to have hyphens (-) in place of the spaces, and everything worked great after that.
Warning - you cannot simply add quotes around the filename, in the url() portion of the style; that is not part of the allowed syntax in CSS, and can cause drawing errors with some browsers (especially Opera and Firefox).
From now on, I'm using hyphens or underlines in place of spaces in my filenames for GIFs, JPEGs and PNGs.
Don't miss the latest web tips and tricks!
Subscribe to our low-volume mailing list:
Privacy Policy
| Copyright © 2006 Fastech Learning LLC, all rights reserved. |
| Phone toll free 1-866-464-6688, Phoenix Metro area 480-895-6688 |
| Problem with this web site? please let us know |