Forum Moderators: open

Message Too Old, No Replies

Problem with unwanted background and border around image in IE6

Background image IE6 unwanted

         

ma11achy

3:41 pm on Dec 17, 2009 (gmt 0)

10+ Year Member



Hi all,

Just wanted to get your opinion on something.

I'm putting together a few sites and have noticed that for some reason IE6 places an unwanted background on transparent images and also a small border of the same colour around the image (approx. 5 pixels). All is fine in Firefox and IE8.

I'm coding with CSS - nothing fancy, just some background images. I wanted to sort this out before I moved onto the rollover images and sprites.

I've done lots of googling about this issue, but unfortunately submitting keywords like "border" and "IE6" brings up tons of stuff not related.

Any insights would be apprecaited.

Thanks,
Martin.

rocknbil

7:47 pm on Dec 17, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Welcome aboard ma11achy, got small code samples?

Do the documents validate [validator.w3.org]?

Images in question styled to border:none?

Images in question linked images, i.e. (pun intended) <a href=""><img></a> ? The border comes from the link, not the image, but setting border:none gets rid of it . . .

IE6 places an unwanted background on transparent images

File types? IE6 is unreliable with transparent .png's, sometimes they work, sometimes they don't, use transparent .gif?

ma11achy

11:41 pm on Feb 16, 2010 (gmt 0)

10+ Year Member



Hey rocknbil - sorry it took me so long to reply to you, I managed to get a nasty bug which put me off everything for a month or so - then I completely forgot about this post!

Long story short, basically it was png's. Thanks for the advice above - I've since converted all the offending png images to gifs.

Cheers,
Martin.

bzgzd

4:51 pm on Feb 17, 2010 (gmt 0)

10+ Year Member



IE6 is unreliable with transparent .png's, sometimes they work, sometimes they don't

Actually many people think that IE6 can not handle transparent png images. But this is not true.

I am going to always use transparent png images. Gif I use only for animations.
Thing is you need to use PNG-8 and not PNG-24.

PNG-8 will be displayed in ie6 same as gif but is mostly smaller and looks better in new browsers because it can have alpha transparency that is in IE6 displayed fully transparent.

I use PNG8 also for images that don't have alpha transparency and also for images that don't have transparency at all when 256 colors are enough (otherwise i use jpeg or png24).

[yuiblog.com...]
[ethanandjamie.com...]

ma11achy

12:53 am on Mar 9, 2010 (gmt 0)

10+ Year Member



Thanks bzgzd, I'll check this out