title: How to keep text opacity 100 when its parent container is having opacity of 50
body: <p>I have a list div which have a opacity set to 50 and inside this div I want to display some text with opacity 100,</p>
  
  <p>Here's what I mean:</p>
  
  <pre><code>&lt;div id="outer"&gt;
    &lt;div id="inner"&gt;
      Text
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The CSS would be:</p>
  
  <pre><code>#outer {
    opacity: 0.5;
  }
  
  #inner {
    opacity: 1.0;
  }
  </code></pre>
  
  <p>I tried that, but it doesn't work.</p>
  
  <p>please help</p>
  
  <p>Regards</p>