div with absolute position behind the normal flow

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">
            <i开发者_如何学编程mg 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;
}

Add position:relative; to the #blindcontainer and #blindclosecontainer classes.