Question

Is it possible to remove the opacity inheritance from a parent to it’s child div?

Example

<style type="text/css">
.parent {
 opacity:.5;
}
.parent div {
 opacity:1; /* I want this to override the ".5", but instead it combines */
}
</style>
<div class="parent"><div></div></div>

Answer 1

Like fmsf says, it’s not possible.
If you’re looking for a way to make background-color or color transparent, you could try rgba. This is not supported in IE6.

#my_element {
  /* ie6 fallback - no opacity */
  background-color:rgb(255, 255, 255);

  /* rgba(red, green, blue, alpha); */
  background-color:rgba(255,255,255,0.5);
}