To change the opacity of an item, we can use this CSS declaration:
opacity:0.25; /*the css standard*/
filter:alpha(opacity=25); /*sets opacity in IE*/
Hmmm. IE doesn’t support the CSS standard. Quelle surprise!
Here’s something else. If the element you are trying to make transparent doesn’t have layout in IE, the opacity won’t be set. The solution? Put zoom:1 on the element.
And I haven’t figured this completely out in IE8 standards mode, but I was trying to set opacity on an image wrapped in a link by assigning the opacity to the link itself. Should be inherited, I thought, like in IE8′s predecessors. But it wasn’t. I wound up getting it to work by assigning opacity directly to the image instead of the link.
So in summary, to get opacity to work in Internet Explorer versions 6 – 8:
- Use filter:alpha(opacity=x), where x is a number from 0 to 100
- place zoom:1 on the element if needed
- assign the opacity directly to an image
