div with absolute position behind the normal flow

Posted by vasion on Stack Overflow See other posts from Stack Overflow or by vasion
Published on 2010-05-11T07:36:20Z Indexed on 2010/05/11 8:14 UTC
Read the original article Hit count: 205

Filed under:
|
|

i am trying to get a div to be my background and am using absolute positioning to achieve it. everything works fine except for the fact that it appears above anything in the normal flow and fiddling with z-indexes does absolutely nothing.

<div id="blind">
<div id="blindbackground"></div>
<div id="blindcontainer"><div class="loader"><img class='loader' src="/img/loader.gif"/></div></div>
<div id="blindclosecontainer"><img id='blindclose' src="/img/close.gif"/></div>
</div>

and this is the css:

#blind{
    position :absolute;
    width:100%;
    z-index: 2;
    border-bottom: 1px silver solid;
}
#blindclosecontainer{
    text-align: right;
}

#blindbackground{
    position:absolute;
    top:0;
    width:100%;
    height:100%;
    background-color: white;
    filter:alpha(opacity=60);
    opacity:0.6;
}
#blindcontainer{
    margin:auto;
    width:500px;
    background-color: white;
    padding:10px;
}

.loader{
    margin: auto;
    width:18px;
    margin-top:10px;
    margin-bottom: 5px;
}

© Stack Overflow or respective owner

Related posts about css

Related posts about html