Different Colors in Different Browsers

HTML & CSS
1

Hello everyone,

I’m working on a site, trying to get the footer looking good … I get everything looking great in Chrome then go check it in FireFox and IE and the colors are all out of whack for the background. I’m using a repeating-x image for the background and used Photoshop to choose the color that should blend it in at the bottom when it stops, but it shows up differently in both of the other browsers aside from Chrome.

I’ve never encountered this. Any suggestions?

-Kenny

2

Sorry, forgot to put the URL:

http://www.picsofdogs.org/

3

Hi Kenny,

Both JPG and PNG images can be tagged with a color profile. The bg.jpg has a color profile and tree.png has not. That makes them rendered different in e.g. FF 3.5+ that has color correction default enabled. (about:config “gfx.color_management.mode=2”)

Solution to crossbrowser rendering could be to remove the colour profile from bg.jpg.

4

Hey Erik,

Thanks so much for your help. I removed all the color profiles from my pictures and made them all jpegs, and I got IE working great and Chrome’s still workin, but FireFox still looks different. And it’s not the images, it’s just the bg color. If I change it though, it will change it in IE and Chrome. Kind of confused about that one…