/CSS/Affect top div opacity without affecting childrne

Affect top div opacity without affecting childrne

#container {
    border: solid gold 1px;   
    width: 400px;
    height: 200px;
    background:rgba(56,255,255,0.1);
}

#box {
    border: solid silver 1px;
    margin: 10px;
    width: 300px;
    height: 100px;
    background:rgba(205,206,255,0.1);
  	transition: 2s background;
}

// if you then want to apply an animation, do it on background-color instead of opacity

Source: stackoverflow.com

Similar codes

0 vote321 views1 answer
React html height 100%
CSS
0 vote304 views2 answers
Remove unused css styles
CSS
0 vote329 views1 answer
Background Image Accessibility concerns
CSS
1 vote248 views1 answer
Css hover lighten background color
CSS
0 vote297 views1 answer
Specific id under class css
CSS
1 vote293 views7 answers
Java to python
CSS
0 vote299 views3 answers
Remove cursor pointer css
CSS
0 vote357 views1 answer
Bootstrap modal resize with jquery
CSS Bootstrap
29 votes369 views6 answers
BackgroundImage react
CSS
16 votes345 views2 answers
Css not last child
CSS