I’m testing a new site, and I have a div with
background-color: #bbf6bb;
That seems innocuous enough to me. And yet, on my MacBook Pro, the color looks very different in Firefox 3.6 vs. Safari 4. In Safari, it’s the color I’d expect from the hex value: a pale green. In Firefox, there’s a definite bluish tint, making the color turquoise.
I’m aware of color inconsistencies that result from different treatment of images across browsers, but in pure CSS? Really? I’m guessing that Firefox trying to correct for my display in hopes of delivering better consistency with print, but I’d much rather have my site look the same hue to my users regardless of their choice of browser. Any ideas? Can someone confirm that Firefox is the culprit here?
[Update: This seems to have been a fluke. Specifically, it’s a narrow issue with Firefox—see my answer below. I’m puzzled, but relieved.]
I’ve isolated the issue! It’s definitely a Firefox 3.6 bug (running on Mac OS 10.6). Seems to have something to do with having a large number of tabs open. If I create a new tab and go to the page, I get the slightly off colors (blue-green instead of just green). If I create a new window and go to the same page, the colors are accurate. And yes, this still occurs if I refresh both instances.
[Edit: Screenshot got misplaced, but I stand by this answer.]