Can't do background transparency on DIV..

[oliver111]

Now the question is, how do i get the background colour to be 45% transparent as i have another background inplace.

#content {
padding:0px 5px 5px 5px;
border-left:solid 1px #FFFFFF;
border-right:solid 1px #FFFFFF;
border-bottom:solid 1px #FFFFFF;
margin:0 auto;
text-align:center;
width:623px;
height:auto;
background-color:#000000;

}

Now the question is, how do i

[oliver111]

Another thing too, i don't want the text to be transparent just the background.

[eak]

#content {
padding:0px 5px 5px 5px;
border-width:0 1px 1px 1px;
border-style:solid;
border-color:#FFF;
margin:0 auto;
text-align:center;
width:623px;
height:auto;
background-color:#000000;
opacity:.45;
}

until rgba color is widely supported, you will have to overlay a div on top of your semi-transparent background to have non-transparent text.
Or, you can use a png image with alpha transparency for your semi-transparent background.

[oliver111]

Thanks but i can't overlay for some reason, z-index won't do it properly and the position seems to place it off the design.

[oliver111]

It seems css has been really crap then, is there not back-ground-color-opacity or anything like that? I tried overlaying the div but it doesn't work the text still goes in with the transparncy.

[eak]

back-ground-color-opacity doesn't exist.

What does exist is rgba() in css3 (see http://www.w3.org/TR/css3-color/).
rgba takes 4 arguments: red, green, blue, and alpha (transparency #).

For now, I would go with a semi-transparent png background image to get the effect you want. It will not work in IE6 unless you use some hacks. Every other browser can render png's just fine.

[oliver111]

I can't go with images, because the heigths and widths are automatic for the many pages on the website.

[eak]

Do you have an example online somewhere?

What have you done so far?

see http://css.dev.ericking.us/ for a quick example I made.

[oliver111]

How did you get the background like that everytime i try that i get horrid pixles in the transparncy i worked out how to get the background on just getting the img right. I use Cs2 abobe btw, thanks for the help btw.

[rmedek]

Oliver, please check your Private Messages.

[eak]

The background is a black 1x1 pixel image with the layer opacity dropped down.
Save for web as a PNG-24, not gif.