title: Why can't child elements override the opacity of parent with a greater value?
body: <p>As we know, child elements cannot as of now override the <code>opacity</code> property of its parent. The <code>opacity</code> property of the parent always takes effect. </p>
  
  <p>This makes sense when the child is trying to underride (override with smaller value) the opacity of the parent. But what about if the child is trying to override it with a greater value? Shouldn't that be allowed? Why can't a translucent parent have an opaque child? Can anyone share thoughts on why such a restriction was decided as part of the CSS design?</p>
  
  <p>Would really appreciate if someone can shed some light on the theoretical reason for this. I'm essentially trying to find out the why-can't part of this (not workarounds; as those've been talked about a lot of times already). I'm sure this is something a lot of newbie SO'ers like me would wanna know.</p>