Skip to: Navigation | Content | Sidebar | Footer


Mozilla Background Transparency Bug

Mozilla-based browsers prior to v1.4 seem to skew the colour of a background image, if it is a GIF with transparency, and the element has been absolutely positioned.

The above example images are background images applied to DIVs that have been absolutely positioned. The left has no transparent areas, and renders correctly. The right has a transparent background, and while the transparency functions properly, the colours shift rather wildly in Mozilla-based browsers. Scrolling of the page results in random shifts back and forth between the proper and incorrect colours as the image scrolls off and on the viewable page. Example colour shift pictured below:

a static image demonstrating the colour shift induced by Mozilla

By comparison, IE and Opera get it right, as depicted:

a static image demonstrating the proper display of the first images

This bug has been tested and confirmed in Netscape 7/Win and Mozilla 1.0/Win. It does not occur in IE6/Win, Opera 6/Win, Phoenix 0.5, and seems to have been fixed by Mozilla 1.3. Feel free to pass on additional testing results.