IE7 & CSS Opacity

Question

I'm curious if any experts out there have had any experience
with this. I have tried using the following in my CSS document:
opacity:.4; //For Everything Else
filter:alpha(opacity=40); //I thought this would do the trick
for IE
And despite that code only Safari, Firefox and every other
browser will display the opacity, but not IE 7. I could care less
about IE 6 because the site I have doesn't get enough hits from IE6
for it to be a concern. And this problem also appears to happen in
IE 8, but I assume there is something in common with the two IEs
that are causing this issue.
If anyone has any ideas that would be great because I am
pretty much out of them with this issue:
http://www.exitplaystation.com/ps3/warhawk/index.php
- This is the site. Even the Spry widgets have the same issue, but
the menu is the most obvious.
http://www.exitplaystation.com/ps3/warhawk/css/exitps_warhawk.css
- This is the CSS document. #menu_bg is the menu container that
expands the width of the screen and is the source of the main
issue.

Answer 1

"SnakEyez02" <[email protected]> wrote in
message
news:ga1fvf$pvv$[email protected]..
> I'm curious if any experts out there have had any
experience with this. I
> have
> tried using the following in my CSS document:
>
> opacity:.4; //For Everything Else
> filter:alpha(opacity=40); //I thought this would do the
trick for IE
>
> And despite that code only Safari, Firefox and every
other browser will
> display the opacity, but not IE 7. I could care less
about IE 6 because
> the
> site I have doesn't get enough hits from IE6 for it to
be a concern. And
> this
> problem also appears to happen in IE 8, but I assume
there is something in
> common with the two IEs that are causing this issue.
>
> If anyone has any ideas that would be great because I am
pretty much out
> of
> them with this issue:
>
>
http://www.exitplaystation.com/ps3/warhawk/index.php
- This is the site.
> Even
> the Spry widgets have the same issue, but the menu is
the most obvious.
>
>
http://www.exitplaystation.com/ps3/warhawk/css/exitps_warhawk.css
- This
> is
> the CSS document. #menu_bg is the menu container that
expands the width
> of the
> screen and is the source of the main issue.
For the filter to work in IE, you need to give the element a
layout (Google
"Ingo Chao hasLayout" for the best article on this).
So try this:
#menu_bg {width:100%;}
If for any reason this creates an issue with the layout and
you don't care
about CSS validation then go with a simple:
#menu_bg {zoom:1;}
Thierry
Articles and Tutorials:
http://www.TJKDesign.com/go/?0
http://developer.yahoo.com/
helps you build applications and mashups