[css] How to make the background DIV only transparent using CSS

I am using CSS attrubutes :

filter: alpha(opacity=90);    

opacity: .9;

to make the DIV transparent, but when I add another DIV inside this DIV it makes it transparent also.

I want to make the outer(background) DIV only transparent. How ?

background-image:url('image/img2.jpg'); 
background-repeat:repeat-x;

Use some image for internal image and use this.

<div id="divmobile" style="position: fixed; background-color: transparent;
    z-index: 1; bottom:5%; right: 0px; width: 50px; text-align:center;" class="div-mobile">

.modalBackground
    {

        filter: alpha(opacity=80);
        opacity: 0.8;
        z-index: 10000;
    }

I don't know if this has changed. But from my experience. nested elements have a maximum opacity equal to the fathers.

Which mean:

<div id="a">
<div id="b">
</div></div>

Div#a has 0.6 opacity
div#b has 1 opacity

Has #b is within #a then it's maximum opacity is always 0.6

If #b would have 0.5 opacity. In reallity it would be 0.6*0.5 == 0.3 opacity

I had the same problem, this is the solution i came up with, which is much easier!

Make a little 1px x 1px transparent image and save it as a .png file.

In the CSS for your DIV, use this code:

background:transparent url('/images/trans-bg.png') repeat center top;

Remember to change the file path to your transparent image.

I think this solution works in all browsers, maybe except for IE 6, but I haven't tested.

It's not possible, opacity is inherited by child nodes and you can't avoid this. To have only the parent transparent, you have to play with positioning (absolute) of the elements and their z-index

Just do not include a background color for that div and it will be transparent.