0

Possible Duplicate:
I do not want to inherit the child opacity from the parent in CSS

My page contains the following <div>:

<div id="OffDiv">
    <asp:Image ID="imgHammer" runat="server" ImageUrl="~/Images/hammer.png" ToolTip="Biding..." />
</div>

and the css : 

div#OffDiv
{
    display: block;
    position: fixed;
    top: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    padding: 0px;
    margin: 0px;
    z-index: 90000;
    background-color: Blue;
    filter: alpha(opacity=40); /* internet explorer */
    -khtml-opacity: 0.4; /* khtml, old safari */
    -moz-opacity: 0.4; /* mozilla, netscape */
    opacity: 0.4; /* fx, safari, opera */
    text-align: center;
}
#imgHammer
{
    margin-top: 100px;
    z-index: 90001
     filter: alpha(opacity=100); /* internet explorer */
    -khtml-opacity: 1; /* khtml, old safari */
    -moz-opacity: 1; /* mozilla, netscape */
    opacity: 1; /* fx, safari, opera */
    z-index: 90001;
}

The problem is the imgHammer has a low opacity like OffDiv (meaning .4) after it is rendered.

How can I change its opacity to 1?

Community
  • 1
  • 1
SilverLight
  • 19,668
  • 65
  • 192
  • 300
  • http://stackoverflow.com/questions/5770341/i-do-not-want-to-inherit-the-child-opacity-from-the-parent-in-css – j08691 Dec 12 '12 at 20:01
  • The opacity of the containing div is going to continue to affect any child elements. Either set the opacity on that div, or remove the image from the div. – kinakuta Dec 12 '12 at 20:02
  • ok, i want to slideUp and Down the offDiv...so if i put that img inside another div how can i synchronize both sildeUp and Down? – SilverLight Dec 12 '12 at 20:13

1 Answers1

1

Simply use rgba colors (0-256 instead of 00-FF) :

background-color: rgba(0,0,0,0.5);

http://jsfiddle.net/aqHXB/

llange
  • 757
  • 2
  • 10
  • 14