PNG's transparency in IE (all versions)

[dragon2309]

Hi, anyone have a hack or workaround for viewing transparent PNG's in IE. There are several solutions out there but they are all designed on you actually embedding the image on the page in <img src> tags, the PNG's i need to hack are referenced by external CSS file, so are unaffected by these solutions.

Anyone found one or got one that works with images based on being referenced in by CSS...?

Cheers, dragon ;)

[dragon2309]

bump, anyone?

[zkiller]

sorry, but i do not understand your question.

[dragon2309]

what part of it? basically, in a div layer i assign it a css class, within that class i define its background image, thats all done in the css file, that background image file is a semi-transparent PNG image.

IE cannot display transparent PNG's properly, there are several hacks and workarounds for this but they all revolve around the PNG's being embedded (as in, they use the <img src="sdkfhdjfh"> tags) i need one that can interface with my CSS sheets and do the same to the PNG's being referenced in there...

dragon2309

[zkiller]

ah, i see what you are saying now. unfortunetly i have never tried using a transparent png for a background image, so i don't have answer for ya. sorry.

[dragon2309]

ok, not to worry

[kiko_friendly]

There is a code to remove anything white in an image - make sure you set any colour you DON'T want removed to something off white. It wont look nice unless edges are EXACTLY perfect - Can only be done in MS Paint.

[dragon2309]

There is a code to remove anything white in an image - make sure you set any colour you DON'T want removed to something off white. It wont look nice unless edges are EXACTLY perfect - Can only be done in MS Paint.Come again? I'm a bit confused on that post? THe PNG's are semi transparent already, so there is no white in them, it's only IE's crappy handling techniques and the fact it was never "taught" how to handle them properly that makes anything transparent appear a white-ish grey colour.

dragon2309

[aswebdesign]

Try http://www.twinhelix.com/css/iepngfix/

[dragon2309]

Try http://www.twinhelix.com/css/iepngfix/Hi, i've tried that one already, unfortunately it only applies to <img> tags inside the HTML body, the only mention of CSS is the fact that it is a solution powered by CSS, it doesnt actually affect the images referenced by CSS

dragon2309

[kiko_friendly]

Save the image as a transparent .gif image.

Ignore the above idiocy. :p

IE doesn't like transparent pngs for some reason. Example of the transparent gif ;

http://seaessess.the-rise.co.uk/

No code needed, just save as a transparent gif...yupyup.

EDIT : The white greyish colour, yep. You are having the exact problem I was having about a year ago when I was making the above website. This is definitely the solution. However, want to keep it png? I don't even think that's possible...

[bcackerman]

ya, well IE6 doesn't support PNG's, just so you guys know. i believe IE7 does. i hae an idea...lets get everyone off IE, haha...i wish

[zkiller]

i hae an idea...lets get everyone off IE, haha...i wish
i second the motion. :)

[Mnemonic]

I do beleive this is the workaround for the problem in css...

background:transparent url(background.png) no-repeat top right;
_background-image:url(background.gif);