if you really don't want to use semi-transparent PNG or GIF images for
the backgrounds you can try getting something with a structure like
that: it creates an additional container that holds the absolutely
positioned DIV with transparent styles inside for the sake of the
semi-transparent backgrounds. then, you put another div in the
container that holds the content. if you tweak it for your needs it
should be fine
#container
{
position:relative;
height:500px;
width:500px;
min-height:500px;
overflow:hidden;
}
#container #stuff
{
height:500px;
width:500px;
min-height:500px;
}
#container #transparent_thing
{
position:absolute;
top:0px;left:0px;
height:500px;
min-height:500px;
width:500px;
/* your transparent declarations here */
}
<div id="container">
<div id="stuff">
</div> <!--stuff-->
<div id="transparent_thing">
</div>
</div> <!-- container -->
2011/3/26 Aaron <[email protected]>:
> Hi,
> thankyou for the suggestion.
> Unfortunately that affects the opacity of all the child elements also - a
> problem I spent a while trying to overcome which is why I resorted to using
> the background: rgba(255, 255, 255, 0.7); and attempting to use the
> gradient for IE as this solves the child opacity issue.
> A
>
--
BAZINGA Designs
http://www.bazingadesigns.com
Igor Wnuk
Ul. PCK 5/20
24-100 Puławy
tel. 667 200 706
REGON: 060622686
NIP: 716-255-43-47
--
--
You received this because you are subscribed to the "Design the Web with CSS"
at Google groups.
To post: [email protected]
To unsubscribe: [email protected]
