Css- Über Opazität

Question

Ich habe ein Hider-Panel mit Opazität 0,5 (Vollbild). Ich möchte ein anderes Panel darauf verwenden. Aber ich muss den zweiten nicht transparent verwenden. Wie sollte ich CSS-Klassen entwerfen?

<asp:Panel cssclass="hider" ID="HiderPanel" visible="false" runat="server"> 
     <asp:Panel CssClass="FormPanel" ID="formpanel" runat="server"> 

    </asp:Panel> 

    </asp:Panel> 

und CSS:

.hider 
{ 
    display:block; 
    position:fixed; 
    top:0px; 
    left:0px; 
    width:100%; 
    height:100%; 
    z-index:1; 
    color:black; 
    background-color:black; 
    opacity:0.5; 
    filter:alpha(opacity=20); 
} 

.FormPanel 
{ 
    float:left; 
    margin-left:5%; 
    width:40%;  
    height:700px; 
    border: 2px solid #555; 
    z-index:2; 
    background-color: #fff; 
    color:white; 
    padding: 10px; 
} 

Answer 1

In meinem Verständnis Sie trennen beide nicht-transparent/transparent halten sollte. Dann leg beide in ein div.

<div> 
    <div class="transparent fix-to-parent"></div> 
    <div class="non-transparent its-own-size"></div> 
</div> 

Und dann Z-Index der zweiten Eltern festlegen.