| Problem with Opera and transparent div
|
garlik
msg:3983473 | 5:28 pm on Sep 3, 2009 (gmt 0) |
The HTML
<div class="transparency">
<a href="index.html"><img alt="" src="header.png" width="800" height="120" border="0" /></a>
</div>
The CSS
.transparency {
font: 13px Lucida, Verdana, sans-serif;
text-align: center;
color: #ffffff;
width: 800px;
padding: 10px;
margin-left: auto;
margin-right: auto;
background-color: #000000;
opacity: 0.80;
filter:alpha(opacity=80);
}
The Results Firefox, IE8, Safari, Chrome: Good Result Opera: Bad Result Seems that the image does not inherit the transparency from div in Opera (version 10) żAny ideas? [edited by: tedster at 9:25 pm (utc) on Sep. 3, 2009]
[edit reason] no screenshots, please [/edit]
|
Mitchman
msg:3985453 | 10:34 am on Sep 7, 2009 (gmt 0) |
This works for me with some random png I tested with. Image specific?
|
Mitchman
msg:3985454 | 10:38 am on Sep 7, 2009 (gmt 0) |
Btw, I tested with the latest released version: Opera 10.0
|
birdbrain
msg:3985468 | 11:26 am on Sep 7, 2009 (gmt 0) |
Hi there garlik, Opera does apply opacity to the image but appears to set different values. If you use a border:10px solid #000 instead of padding:10px and background-color:#000,
you will see that the image opacity is identical to Firefox et al. ;)
.transparency {
font: 13px Lucida, Verdana, sans-serif;
text-align: center;
color: #ffffff;
width: 800px;[red]
/*padding: 10px;*/[/red]
margin-left: auto;
margin-right: auto;[red]
/*background-color: #000000;*/[/red][blue]
border:10px solid #000;[/blue]
opacity: 0.8;
filter:alpha(opacity=80);
} |
|
Why Opera does this is a mystery to me.
Perhaps their forums may shed a light on it. birdbrain
|
|
|
