javascript - background of div wont change transparency -

javascript - background of div wont change transparency -

i have div 'floater_editdata_panel_popup' contains updatepanel, placeholder, , more divs.

i want increment transparency of outer div 'floater_editdata_panel_popup', allow user see background, slightly.

so far background colour of div remains white,while text boxes faded

.floaterdiv{ top: 0%; left: 0%; height: 450px; width: 800px; border: solid 1px blue; /*background-color:white;*/ background-color:rgba(255,0,0,0.5); margin:1; text-align:left; outline-style: none; display:none; overflow:hidden; zoom: 1; filter: alpha(opacity=40); opacity: 0.4; z-index:999999999999; /* background-blend-mode: multiply;*/ } <div id="floater_editdata_panel_popup" title="feature information" class="floaterdiv"> <p1>select feature view/edit feature information.</p1> <br /> <br /> <br /> <asp:updatepanel runat="server" id="updatepaneldetails1" updatemode="conditional" childrenastriggers="true"> <contenttemplate> <asp:placeholder id="placeholder1" runat="server" > </asp:placeholder> <br /> <br /> <div id="editdatapanelmessageoutput" style="color:red;"> </div> <div id="featuremeasureoutput"></div> <br /> <br /> <div class="buttonwrap"> <div id="span2" class="actionbtns" style="display: inline-block;" > <asp:button runat="server" id="updatebutton" value="save" text="save" onclientclick="validateeditdata();" causesvalidation="true" validationgroup="g_currentselectedlayername" /> </div> </div> <asp:validationsummary runat="server" id="valsummary1" headertext="you must come in value in next fields:" displaymode="bulletlist" enableclientscript="true" showsummary="true" enabled="true" /> </contenttemplate> </asp:updatepanel> </div>

which produces following:

please advise

try removing

filter: alpha(opacity=40); opacity: 0.4;

this affecting contents of div, not background itself.

you should alter rgba values to

rgba(255,255,255,0.3);

for white semi-transparent background

javascript jquery html css asp.net