Mac IE5 transparent background won't work

[TheDust]

I have a piece of Javascript to detect what OS and browser a user has and I load a CSS file based on that. However, the CSS I'm using for Mac users isn't working.

This is all taking place in an iframe inside of the main page. For IE and Mozilla I have a DIV with a semi-transparent background. For Mac and Opera users, I just want it to be completely transparent to see the background of the main page. I've tested the Mac CSS on Windows and it works fine, but on Mac IE5 I just get a white background instead of a transparent one. Here's the CSS I'm using:

<code>iframe.css (applicable to all users)
----------
body {
margin : 3px 3px 3px 3px;
background : transparent;
}
.contentFrame {
position : absolute;
top : 0px;
left : 0px;
background : transparent;
z-index : 2;
padding : 5px;
}

mac.css (Mac and Opera users only)
-------
.seethrough {
width : 100%;
height : 392px;
position : absolute;
top : 0px;
left : 0px;
background : transparent;
z-index : 1;
}</code>

Here's an example of an HTML page that is using this method:

http://www.greenstreetchicago.com/news.htm

It will probably be easier to understand what I'm going for when you see that page. Any ideas what CSS is invalid here?

 

[BillyRayPreachersSon]

Try adding the "allowTransparency" attribute to your iframe, with a value of "true":

<iframe allowTransparency="true" ...

This value defaults to false, and I don't know if the CSS property overrides this or not. More info can be found at:

http://msdn.microsoft.com/library/d...ml/reference/properties/allowtransparency.asp

It might be worth trying the examples given on that page on a Mac, too.

Hope this helps,
Dan

 

[TheDust]

The iframe already is set to allowTransparency="true"... anyone have other ideas? This one is pretty baffling to me...