[cemac]

Hi, I want to create a div with a transparent background. The transpareney works fine but the div I created to make the text solid doesnt. Sorry if this is a real noob question but im still new to css and not great at identifying where I am going wrong. Thanks.

#box {position: absolute;
left:242px;
height:100px;
width:200px;
filter:alpha(opacity=50);
opacity: 0.5;
-moz-opacity:0.5;}

^^^This code works.

#transbox {
filter:alpha(opacity=100);
opacity: 1;
-moz-opacity:1;
position: relative;
}

^^^Div created to keep type solid.

.medium-pink { font-family : Arial;
font-size: 80%;
color : #d32f8b}

^^^Type

html looks like this:

<div id="box>
<div id="transbox">
<div class="medium-pink> .....................</div> </div> </div>


I did try and put the transbox code in with the type but it didnt work so I tried to create a new box and put the type init but that didnt work either.

[Dusteh]

I seem to recall this is a problem that won't go away... a child tag seems to inherit the transparency setting regardless of any overriding css you try and apply to it.

You have two options:
place the text box outside the transparent box and position it over the top using css (a bodge)

Use a transparent PNG as a background, making sure to include the transparent PNG hack thingy for IE6.

[cemac]

Thanks. I think I will have to try the first option.
Sorry what exactly is a bodge??

[finbarr]

Originally Posted by cemac

Thanks. I think I will have to try the first option.
Sorry what exactly is a bodge??

a hack - essentially

[cemac]

a hack? so what exactly do I do then?

[Justinraff]

a hack as in moving your text div on top of the trans div using
position:relative;
top:100px
or something along those lines.

are you cemac off the shine board?

[cemac]

maybe. please tell me this isnt justy.

[Justinraff]

ok