Mysterious light blue border around image

Appears on laptop only--not on desktop

[jandrews]

I purchased a stock image with a white background from istockPhoto. Using the image, I created a header graphic in Fireworks. Everything looked great on my desktop computer. However, when I came home, and viewed the webpage from my laptop, I noticed a light blue border (shadow) around the image.

Several months ago, I noticed the same thing with Adsense ads. A light blue border/shadow appeared around Adsense ads when a certain webpage was viewed on my laptop. When I removed the [div] tags around the Adsense ads (which were incorporated into the page), the blue border disappeared.

Is this "blue border/shadow" caused by how the laptop monitor renders images? The only time I see the light blue border is when I'm using my laptop. Laptop manufacturer is Acer. How do I get rid of this?

[RonPK]

* different browsers?
* different monitor settings (color depth)?

[jandrews]

No, same browser on both laptop & desktop--Firefox.

Re: different monitor settings, I wouldn't know. I use the standard monitor settings that come with the laptop. Haven't changed a thing. Same for the desktop.

I think I might have found a possible solution. This guy looks like he's having a similar problem. [webmasterworld.com...]

I will try...

a img { border-style:none; }

and see what happens. Thanks.

[rocknbil]

The border-style:none may fix this, but on a more basic level, is the border="0" attribute set on the image tag?

<img src="yourimage.jpg" border="0">

If the end use uses their own style sheet or otherwise or ignores the style sheet you will still have the border.

This will usually only manifest itself if the image is a link:

<a href="somepage.html"><img src="yourimage.jpg" border="0"></a>

I've never heard of it from a div tag though.

A bit off topic, but I see a lot of pages without a border, but has a linked "_" right after the image. This is due to white space after the image, like so:

<a href="somepage.html"><img src="yourimage.jpg" border="0"> </a>

If you're using border="0", dig around your browser settings for anything relating to images, such as "show image placeholders" - this may be a residual effect of one of those settings (wild guess on that one.)

[jandrews]

Rocknbill - Your answer is rockin' thanks! I don't know whether the border="0" attribute is set on the image tag, as this is a Wordpress site (many PHP files, and I don't know where to go to find that). I have contacted someone who is more familiar with Wordpress, and he should be able to tell me.

Yes, the header image is a link (when clicked, it takes the user back to the homepage).

Re: The "div" tag. I was wrong about what I wrote previously. I just went and looked at what I have. Turns out, removing the [div] tag did not work. Instead, I had to change the div tag to: [div class="ad" style="float: left; border: none; width: 336px;"] and then the blue border went away. The border:none was what did the trick. I sometimes forget what worked, b/c I'm teaching myself as I go along. Trial and error, and then more trial and error.

Thanks.