2

Currently I'm working on a website with some bright colors. I'm trying to implement a seamless overlay on top of a few images, to give the sensation that the background is flowing over the image, however, for some reason Firefox won't render my .PNG images as the color I've made them in Photoshop.

I've tried this with the same page/image setup in SRWare Iron and Internet Explorer 8, which both display them properly.

The only remedy I've found so far is switching to .GIF, which renders the color properly in all three browsers, but I can't use any additional effects (such as drop shadow, which I need). I'm also using a large sprite sheet, so to be able to keep everything on one image is preferred.

Is there a color setting I'm missing in order to make this work properly, or am I going to be stuck with .GIF?

A picture with three different versions (below):

enter image description here

  • Firefox / .GIF (drop shadow didn't render properly)
  • Firefox / .PNG (no drop shadow)
  • SRWare Iron / .PNG (drop shadow)
Improve this question

1 Answer 1

Reset to default
1

From the Mozilla website:

This can be caused by a problem with the color profile for your display monitor or color profiles embedded in images. You can disable color management to test that. You can set the pref gfx.color_management.mode to 0 on the about:config page to disable Color Management. You need to close and restart Firefox or maybe even reboot the computer to make the change effective.

Improve this answer
2
  • Changing that setting worked for me, and apparently (I didn't check until now), on Firefox in OS X it displays properly without editing the config. I assume there's no way to force this setting on page load? I can't ask for everyone that visits my website to change this setting unfortunately.
    – John
    Commented Jul 25, 2012 at 2:05
  • Not that I'm aware of, sorry.
    – Everett
    Commented Jul 25, 2012 at 2:16

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .