Mysterious border on images

Border appears when ctrl+scrolling

[saZmer]

Hello!

I'm having a problem with strange, whitish borders on images when I use the ctrl+scroll function in IE 7. At original size it looks fine but if I ctrl+scroll up or down the border appears. Everything else looks splendid, nomatter the size.

Why is this?
Is there a way around it?

Best wishes
Samuel

[limbo]

Hi saZmer

Welcome to WebmasterWorld [webmasterworld.com] :)

Does img {border:none;} in your css fix it?

[saZmer]

Hey Limbo,
thank you :)

No, I've tried to disable borders in every possible way. And succeeded in a way, there is no border in "normal-mode". When you change the size by ctrl-scrolling it appears though.

I'm trying to come up with a logical reason to why the border appears but I'm failing :/
To clarify, the border isn't really a border. It's more like a whitish edge on the image - not to be confused with the borders achieved with css or by linking your image and so on.

Thanks for your effort Limbo :)

[thecoalman]

I just ran a few tests, using a solid black image on a red background and when zooming in or out IE changes 1px of the edge to a dark red or in other words creates a soft edge. I determined this by Prt Scr then pasting it in my image program and zooming. Black on black of course doesn't make a difference.

It's not highly visible, my only suggestion is due to the placement of your image its creating the wrong color soft edge if it's really visible.

Edit: Actually upon some further testing using a background image that is muticolored it appears that it adds a transparency to the edge of the image and has no rhyme or reason as to what it does. Zooming in quite far produced a 3px semi transparent edge on the right and bottom of the image yet nothing on left or top...

[thecoalman]

Now it's getting really strange..I just looked at one of my own sites where the background color for the image is the same color as the background on the div so it blends in and I see this border you are speaking of when zooming in. That really makes no sense because if it's adding a transparent soft edge then it should be the same color. This FYI is a gif image... but the behaviour gets even stranger. I created both a solid colored GIF and JPG on a page with the same color. Zooming in produces the border on the JPG but not on the GIF in this case which is really baffling.

To tell you the truth I doubt there is anything you can do to prevent this because there is no pattern as to why or when the border appears.

[saZmer]

I'm using an image with the same background color as the one of the div. Tried with both gif and jpg, didn't make a difference at all for me!

I guess I'll just have to live with it. A shame though, those borders takes the edge out of the design :/

Hope noone uses the darned ctrl-scroll :P

Thanks for your effort man, you seem to have put more work into it then even I did! :)

[thecoalman]

I'm using an image with the same background color as the one of the div. Tried with both gif and jpg, didn't make a difference at all for me!

That's whats weird, it only does it some of the time with a gif, perhaps image size has something to do with it.