How to set opacity in parent div and not affect in child div?
css, opacity, parent-child
Solution
May be it's good if you define your background-image in the `:after` pseudo class. Write like this:
.parent{
width:300px;
height:300px;
position:relative;
border:1px solid red;
}
.parent:after{
content:'';
background:url('http://www.dummyimage.com/300x300/000/fff&text=parent+image');
width:300px;
height:300px;
position:absolute;
top:0;
left:0;
opacity:0.5;
}
.child{
background:yellow;
position:relative;
z-index:1;
}
Check this fiddle
Problem
Hey i am searching in google but i can't fine any perfect answer I want to Opacity in parent DIV but not Child DIV Example HTML ``` <div class="parent"> <div class="child"> Hello I am child </div> </div> ``` Css ``` .parent{ background:url('../images/madu.jpg') no-repeat 0 0; } .child{ Color:black; } ``` Note: -- I want to background-image in `Parent Div` not Color