PDA

View Full Version : background-image problem

plevans
10-21-2006, 03:15 AM
http://fenceprotool.com/photos.html

I have another problem that I can't figure out. I have a photo gallery w/click to enlarge thumbnails. The thums are actually styled links with photos as background images. They were working fine until today and now - no thumbnail images! Can anyone see the problem?
kitchin
10-21-2006, 09:28 AM
a.thum3 {background:url(images/thums/3.jpg);}
should be
a.thum3 {background:url(3.jpg);}

Except in Netscape 4.............
plevans
10-21-2006, 02:25 PM
kitchin:

Thanks for the suggestion but that didn't work. My images are in the /images/thums folder so it makes since to me that the path should be included.

What's perplexing me is that the background-images were displaying until yesterday. I'm sure I must have changed something but I can't find it. I'm hoping a fresh pair of eyes might catch it.
plevans
10-21-2006, 02:39 PM
Well I solved the problem by embedding the css for the photo gallery in the <head> which isn't how I prefer to do it. It doesn't make sense to me why it works that way but not with an external style sheet.
kitchin
10-22-2006, 04:15 AM
Because I was right! I tested it. Read: http://www.blooberry.com/indexdot/css/syntax/units/url.htm
plevans
10-22-2006, 04:50 AM
After reading the article I am still having a hard time wrapping my over-taxed :confuz: brain :confuz: around this one so maybe you can help me understand it.

My .html document is in the "www" folder as are the "css" and "images" folders. The "thums" folder is a sub-folder of "images". In order to use an external style sheet stored in the "css" folder what is the correct URL path to an image in the "thums" folder?

It seems to me it should be the same as when the style is embedded in the head of the document. But like I said, my brain is definitely over-taxed...too many hours at the computer!
kitchin
10-22-2006, 03:38 PM
Ah, I did have the wrong relative path, so I was wrong :wah: but I was right that the path is relative to the css file. If it was like this:

http://fenceprotool.com/photos.html
containing:
<link rel="stylesheet" type="text/css" href="css/photogallery.css">

http://fenceprotool.com/css/photogallery.css
should use:
a.thum3 {background:url(../images/thums/3.jpg);}

That must be right!