Opacity

[softweb001]

Hi guyz........am having a problem withthe opacity property. what i want is to make a dive transparent and the text on it should be black and visile...the div is already transparent but the text is not visible and i have tried setting the font-weight property but i still have thesame problem...help me out please.thanks

[dsonesuk]

Anything within a div container that is using opacity becomes transparent as well, you have to keep any element to want visible OUTSIDE the div that is using transparency/opacity.

 

<div class="outer">

<div clas="trans"></div>

<p>Text</p>

</div>

 

.outer {position: relative;}

.trans{position:absolute;top:0; left:0; right:0; bottom:0; z-index:0; opacity: .5; background-color: #ccc;}

[softweb001]

okay thanks...........but i dont understand something that is evry content am goin to put on the page will they be inside the outer div.thanks

[softweb001]

and there is another problem am having.

 

i have this code

 

#container{

 

}

[softweb001]

sorry this is the full code

 

#container{

width: 900px;

height: auto;

 

margin: 0 auto;

 

background-color: #FFF;

}

 

#inner{

width: 50px;

height: 150px;

 

float: left;

 

background-color: #000;

}

 

 

 

 

in my html page

 

 

<div id="container">

<div id="inner">

 

</div>

</div>

 

 

i expect the container height to increase automatically base on the content i put inside it that is why i have that inner div but it is not increasing please help me out.......thanks

Edited December 18, 2013 by softweb001

[dsonesuk]

The outer container cannot detect the boundary of floated child element unless you use overflow: hidden; on the outer container.

[softweb001]

alright thanks