schaduwrandjes <div> om <div> werkt niet?

Hallo,

Wie wil mij even helpen ik ben een website aan het bouwen en wil om de Container 2 shaduwrandjes plaatjes met behulp van een plaatje.

Ik heb om de container een div gezet mains zie code

Probleem is ik kan alleen maar te plaatjes laten tonen als ik bijvoorbeeld
height:2000px meegeef
maar height auto pakt hij niet.

Mijn vraag wat doe ik verkeerd. Want zoals hieronder krijg ik alleen de container te zien en de rest word genegeerd tenzij ik ze een height meegeeft???

css:

#mains{
width:1016px;
height:auto;
background-color:#CCCCCC;

}

#links{
background-image:url(images/links.jpg) ;
background-repeat:repeat-y;
width:7px;
float:left;

}

#rechts{
background-image:url(images/rechts.jpg);
background-repeat:repeat-y;
width:7px;
float:right;

}


#container {
width:1000px;
background-color:#f9f9fc;
border: 1px solid #333333;
float:left;
}

als code heb ik:
<div align="center">
<div id="mains">

<div id="links"></div>
<div id="container">
bla bla bla bla
</div>
<div id="rechts"></div>
</div>
</div>