CSS filters - sometimes working, sometimes not?

Posted by a2h on Stack Overflow See other posts from Stack Overflow or by a2h
Published on 2010-03-13T04:31:31Z Indexed on 2010/03/13 4:37 UTC
Read the original article Hit count: 309

Filed under:
|
|

I'm on the verge of pulling my hair out over this.

Here I have a block of perfectly functioning CSS:

#admin .block.mode.off
{
    opacity: 0.25;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=25)";
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=25);
}

Meanwhile... Internet Explorer 8 couldn't care less about my filter declarations here:

#admin .drop .tabs
{
    margin-bottom: 12px;
}
#admin .drop .tab
{
    margin-right: 4px;
}
#admin .drop .tab.off
{
    cursor: pointer;
    opacity: 0.5;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=50)";
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);
}
#admin .drop .tab.off:hover
{
    text-shadow: 0px 0px 4px #fff;
}
#admin .drop .tab.on
{
    cursor: default;
    text-shadow: 0px 0px 4px #fff;
    -ms-filter: "progid:DXImageTransform.Microsoft.Glow(color=#fff, strength=4)";
    filter: progid:DXImageTransform.Microsoft.Glow(color=#fff, strength=4);
}

My document shows in IE8 Standards, and I am assuming the developer tools are a load of tuna, because the functioning block shows up in its CSS tab as:

filter: progid:DXImageTransform.Microsoft.Alpha(opacity=25); opacity: 0.25

Does anyone have any ideas?

© Stack Overflow or respective owner

Related posts about internet-explorer

Related posts about css