PNG transparency is shown as white, how do I fix this?
In a PNG file with transparency (such as this http://puu.sh/L19h ), I can only see this. http://puu.sh/L1aa
Can anyone please tell me how to fix this?
Thanks.
Chosen solution
It's normal, see https://bugzilla.mozilla.org/show_bug.cgi?id=754133 If the background image wasn't white and the letters were gray as the tab background, your transparent PNG will be invisible.
Read this answer in context 👍 1All Replies (12)
Do you see this when viewing image files directly, or when they are in a page, or both?
Could you try disabling graphics hardware acceleration? Since this feature was added to Firefox, it has gradually improved, but there still are a few glitches.
You usually need to restart Firefox in order for this to take effect, so save all work first (e.g., mail you are composing, online documents you're editing, etc.).
orange Firefox button or classic Tools menu > Options > Advanced
On the "General" mini-tab, uncheck the box for "Use hardware acceleration when available"
If you restart Firefox, is the issue resolved?
Edit: By the way, I'm running Firefox 14. Did you see this issue in earlier versions of Firefox?
Modified
- So far I have only experienced this while viewing image files directly.
- Unfortunately, disabling hardware acceleration doesn't appear to have helped.
- Sorry, but I haven't really been paying attention to the updater, so I'm not really sure if this only started happening after I switched to Firefox 15.
Thanks for the reply.
Modified
Is it possible that you have an add-on or userscript that changes the default image viewing? In recent versions of Firefox, images are now centered on a dark background instead of being all by their lonesome. Do any of your add-ons or userscripts change that?
No, none of my userscripts or my addons should affect anything to do with images (except maybe Ad-Block Plus, but I fail to see why that should affect image transparency).
Chosen Solution
It's normal, see https://bugzilla.mozilla.org/show_bug.cgi?id=754133 If the background image wasn't white and the letters were gray as the tab background, your transparent PNG will be invisible.
Ah I see now. Thanks for your help.
I think it would have been a better fix to let the user select a different color for the entire background... oh well, it's not too late, Firefox 15 is still in beta...
There is a mockup about that, check the comment 16 of the bug report I linked.
I got the same white background problem using a semi-transparent PNG as DIV background. While the white background can have a sense on standalone images, I think there are hundreds of web sites which rely on DIV background image transparency.
I can fix this on my own computer with some tricks and add-ons, but we must assume the average Random J. User visiting our fancy site don't know how to do this.
The CSS opacity parameter don't solve the problem, because DIV children can't be less transparent than their parents (this means to have a sort of plywood made with absolutely positioned DIVs) .
Since the PNG transparency is working on IMG elements, I hope it will be restored at least for backgrounds, too.
See also:
- Transparent standalone images: https://addons.mozilla.org/firefox/addon/transparent-standalone-imag/
Hi MarcoBernardini, can you post a link to the problem page and indicate which element has the issue?
@ jscher2000: I hardly try to replicate the problem (semi-transparent PNG image as DIV background shown as opaque), but without to have it again. I made this test page, with stacked semi-transparent backgrounds, and it wokrs smoothly for everyone in my Linux User group: http://funadium.com/firefox15test.html If the problem reappears I'll take a screenshot before to try to fix it. Thanks anyway!