[thelist] Strange Mozilla problem with a CSS background image

[Tim Fountain]

I recently started moving my site at http://www.ukterrorist.com/ over
to XHTML/CSS layout (getting there but still a way to go until it
validates), but I'm having a very strange problem with two particular
background images in Mozilla.

The sidebar header images, (the ones behind the text 'menu', 'user',
'latest headlines etc.), sometimes appear in Mozilla as if they were
greyscale, as shown in this screenshot:
http://tfountain.co.uk/mozillaproblem.jpg. Refreshing the page
sometimes fixes it (sometimes makes it worse), scrolling down and back
up again sometimes changes the images as well. When viewing the images
alone in Mozilla they display fine.  All other browsers that I've
tried display the images correctly.

Originally I thought it could just be a problem with the files, so as
I still have the original .bmps, I resaved them using a different
graphics package, however that didn't help at all.

Here is the relevant part of the stylesheet for the divs:

.lsboxheader {
   background-image: url('/images/lshead.gif');
   background-repeat: no-repeat;
   height: 32px;
   font-size: 9px;
   text-align: center;
   padding-right: 14px;
   padding-top: 19px;
   }

.rsboxheader {
   width: 156px;
   height: 32px;
   background-image: url('/images/rshead.gif');
   background-repeat: no-repeat;
   font-size: 9px;
   padding-top: 19px;
   text-align: center;
   }

I've run out of things to try, so any suggestions would be greatly
appreciated!

--
Tim Fountain (tim at tfountain.co.uk)
http://www.tfountain.co.uk/