Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
Should I use PNG transparency or CSS transparency?
My first instinct is to go with CSS. However I heard somewhere that the filter in IE is slow and that I would get better results with PNG (ignoring IE6).
However from personal experience I know that PNG transparency is slow in FF3.
Is there a definite answer to this?
Thanks.
They’re two different solutions to two different problems. CSS transparency (I assume you’re referring to the opacity property) will make an entire element (its border, background and content) transparent, whereas alpha PNG transparency is only useful in situations where you’d use images, for example an elements background.
I cant think of many situations where you could use either to the same effect.
There are of course RGBA colours in CSS3, however browser support is currently too low for it to be a viable option in public facing sites/applications.
P.S. I can’t say I’ve run into any FF3 alpha PNG performance issues myself.
Follow-up to comment:
OK. In that case I’d go for the CSS opacity property.
Although the filters performance may not be optimal in IE6, it means you don’t have to waste bandwidth and an additional HTTP request on an image. Plus, if you wanted to get the image to work in IE6 as well you’d have to use AlphaImageLoader, which I’m sure would be just as slow (if not slower) than the alpha filter.