PDA

View Full Version : browser issue with transparent png


JBD
11-12-2008, 08:40 PM
I'm using a transparent png for a logo on a clients website which works fine in Safari but does not display in IE... is there a way of over coming this?

http://jonballdesign.co.uk/home/caffegus/docs/index.htm

Cheers!

JBD

domedia
11-13-2008, 01:23 AM
IE does not support the alpha channel in PNG's.
I was going to give an workaround but I cannot even see the logo on the site in FF even.

JBD
11-13-2008, 07:44 PM
A quick fix (as I needed to show the client my initial idea) was to fill the transparent area with the background colour as you can now see. Ideally I'd like to use the transparent PNG version of the logo. Any ideas? I used a trans PNG on this site but I can't work out how I did it...

http://www.ntatalentworldwide.com/

domedia
11-13-2008, 10:44 PM
Not sure what exactly you're asking about jbd :)

JBD
11-13-2008, 11:31 PM
Whilst working on a previous website a member of DC called Cary explained how I could overcome the IE issues with PNG's.

This is how he explained to do it:
http://homepage.ntlworld.com/bobosola/pnghowto.htm

I've followed these steps but still can't see what I'm doing wrong.

Can someone explain exactly what code needs to go into the CSS and html document?

note: after trying to add the necessary code I decided to remove it all again as I somehow managed to loose everything even in Safari.

Cary
11-14-2008, 12:02 AM
Do you have a version of the page online that's using the png logo, so we can see what you're trying to work with?

domedia
11-14-2008, 12:58 AM
What I did on a recent project was to server the PNG, and then use the IE conditional statement to load a seperate file for IE.

2bz2p
12-02-2008, 04:47 PM
What I did on a recent project was to server the PNG, and then use the IE conditional statement to load a seperate file for IE.


Could you eloborate on this, because I am working on a site know that I want all PNG's on it and to include the CSS Images. I found a couple fixes though it doesnt solve the PNG images called in the CSS

Thanks
2b

domedia
12-02-2008, 08:31 PM
Do not use PNG's for all your images. Be selective and use the best format for each image.

What you can do if you absolutely need to use a PNG with alpha channel, is to make a PNG and a transparent GIF.

Then you load a separate stylesheet, maybe call it IE7.css, and use IE's conditional statements to load it only for IE7 and below.

2bz2p
12-02-2008, 10:25 PM
Cool sounds good
thank you
Mike

Rob_Che
12-04-2008, 08:21 PM
What I did on a recent project was to server the PNG, and then use the IE conditional statement to load a seperate file for IE.
This iswhat I've started to use. The 'fixes' rarely validate which bugs me and I haven't found one that is perfect and stable yet.

domedia
12-05-2008, 02:14 PM
The 'fixes' rarely validate which bugs me and I haven't found one that is perfect and stable yet. This was what I found as well.. they might work in certain scenarios, but extremely unreliable.

m1a2x3x7
12-13-2008, 11:16 PM
Try this next time.

http://labs.unitinteractive.com/unitpngfix.php