How to fix color mismatch between images and CSS background colors

You'd think I'd learn something once and then remember that lesson the next time. But nooooo....

Once again, just this evening, I was bitten by the problem of colors in my image files not quite matching the background color I set using the CSS background-color tag. I'd designed a lovely navy blue header for a client's website with their logo and a nice picture placed in <div> layers on top, and it looked just fine in Firefox. But when viewed in Internet Explorer, a lighter blue line appeared between the logo and the photo...

The above image is how it looked  in Firefox, no problem...

And here is the same page in Internet Explorer...

Just barely visible on some monitors, there is a vertical line that is just slightly lighter in color than the surrounding blue, right between the CCA logo and the photo.

Here is a closer look...

I realized that this line corresponded to a bit of the <div> container holding the image. I'd set the background-color property in my CSS for this <div> to the same color I'd used in the images: #000066. But #000066 looked slightly different in Internet Explorer than it did in Firefox. The image color and CSS background color didn't match in Internet Explorer. This color mismatch can crop up in other browsers as well -- Safari has the same issues.

After scratching my head in frustration for awhile, I finally remembered that I'd come across this problem before and the solution was very simple.

Instead of using a hexadecimal code for a background-color property, I simply made a graphic in Photoshop 25 x 25 pixels in size that was the #000066 color I used in the image files. I then used that graphic as my background-image in the <div>.

So, in my CSS file, instead of this...

#header-photo-block {
background-color:#000066;
}

...I used this...

#header-photo-block {
background-image:url(/graphics/navycolor.png);
background-repeat:repeat;
}

...and, voila! Color mismatch gone.

Now, if only I can remember this for the next time it happens...