Nov 26, 2007
IE 5.5 and IE6: AlphaImageLoader Filter
Unless you’ve been residing under a fairly large rock for the past seven years, you should be well-aware that Internet Explorer 5.5 and 6 do not provide native support for PNG rendering. To get IE to play nice, you need to apply Microsoft’s proprietary AlphaImageLoader Filter to the element rendering the PNG while at the same time ensuring IE doesn’t see any “background-image” properties that you’d want other standards-compliant browsers to see.
Here’s my most often used implementation:
.main-c {
width: 992px;
height: 13px;
margin: 0 auto;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',
sizingMethod='image',src='assets/img/main-bg.png');
}
.main-c[class] {
background: url(../assets/img/main-bg.png) no-repeat 0 0;
}
Standards-compliant browsers will ignore the filter while IE6 and below will ignore the CSS class attribute.