Product Image CSS
 

Is there a way to add CSS styles to the thumbnail and product Image? I am wanting to add some effects (glow, border) to them both the same.

Re: Product Image CSS
 

Sure, just edit product_thumbnail.tpl

Re: Product Image CSS
 

Oh okay. I wasn't sure if there was a style in the default css file for thumbnail and product image already.

Re: Product Image CSS
 

Not by default I don't think

Re: Product Image CSS
 

You could try these, I think 4.1.8 does the same...

locate the following in skin1/skin1.css for Product page thumbnail image...
.PImgBox { /*and add/change the border here*/ }
or if it fails add to CSS with...
.PImgBox IMG { border: 5px solid #FF0000; /* a test red border direct to IMG */ }

the same for Categories page thumbnail images, locate in skin1.css ...
.PListImgBox { /*and add/change the border here*/ }
or add directly to img in CSS with...
.PListImgBox IMG { border: 5px solid #FF0000; /* a test red border direct to IMG */ }

Re: Product Image CSS
 

Thank you!

I am not sure why this is not working:
------------------------------------------------------
.PImgBox IMG {
Filter: Glow(Color=#00FF00, Strength=20);
}
------------------------------------------------------


I used the border style first and it worked, but I removed that and am trying this filter. I do understand this only works in IE, but still want to use it. Any idea why it does not work.

JUST NOTICED:
When I reload the page with the image on it, I see the glow underneath and then the image loads right overtop of that style. It's almost like "the style is happening underneath the image rather than TO the image".

Here is an example of it working on another website:
http://www.fred.net/dhark/demos/css/css_filter_examples.html

Re: Product Image CSS
 

Nevermind, I figured it out.

Re: Product Image CSS
 

um not sure about IE proprietary code.

Perhaps try an assortment of
position: absolute;
or
position: relative;

with or without
z-index: 999;