Couple of people around the forums and here commented that none of the current Internet Explorer 6 PNG scripts provide fix for the issue of using png image as CSS repeated background (background-repeat: repeat/repeat-x/repeat-y).
Therefor with no generic solution at this time I thought of three possible workarounds:
- Use sizingMethod=’scale’
- Use flash for rendering the png
Here I will explain the first one since it was the easiest to try.
The idea is very simple just use filter: progid: DXImageTransform.Microsoft.AlphaImageLoader(enabled=’true’, sizingMethod=’scale’, src=’the-image-you-want-to-repeat.png’ ) and make sure you properly apply the other CSS rules. This technique uses scaling instead of repeating but for shadows and other cool effects it is sufficient.
End result and demo following:
For more info see the demo under Internet Explorer 6