Internet Explorer 6 tiene un gran fallo, no le gustan los PNG, así que tratará la transparencia de ellos (su punto más fuerte), como si no la tuvieran. Ha habido muchos fix y hacks por los siglos de los siglos, pero aquí te traemos otro que da resultado.
Los pasos a seguir son muy simples:
- Metemos la imagen PNG entre un div con class png-holder (Obviamente “transparent.png” es tu imagen PNG que quieres que tenga transparencia en IE 6:
<div id="png-holder"></div>
- Así ya funcionaría en IE 7, 8, Firefox, Safari y Opera, pero para que funcione en IE 6 Hace falta un paso más. Definimos el código CSS:
#png-holder { width: 300px; height: 150px; text-indent: -9999px; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/transparent.png', sizingMethod='crop'); }
Como se ve, se usa la propiedad filter de Microsoft. Con esto ya podremos ver nuestra imagen con transparencia en Internet Explorer 6.
Vía | Web Monkey