Expanding divs

1

This is probably an age old issue but how to get divs to expand? I am trying to get my super container div background image to expand to the bottom of my page without any content. I have read several threads on the subject and googled as much. I read this article http://qrayg.com/learn/code/footerstick/ but this only works if the background image is in the page div.

css


img, div, a { behavior: url(iepngfix.htc) }
body { 
 margin: 0px 0px 0px 0px;
 background-image: url('../images/LegacyWeb_Background.jpg');
 background-repeat:no-repeat;
}
html, body { 
  margin: 0px;
  padding: 0px;
  text-align: center; 
  height:100%;
  
} 
#wrap { 
  margin: 0 auto; 
  width: 951px; /* put the total with of that site */ 
} 
.page {
 position: relative;
 width: 951px; 
 margin: 0 auto; 
 text-align: left;  
 /*http://qrayg.com/learn/code/footerstick/*/
 min-height: 100%; 
 height: auto !important; 
 height: 100%; 
}
.top_corners {
 position:relative;
 left:0px;
 top:42px;
 width:951px;
 height:154px;
 background-image: url('../images/top_corners.png');
 background-repeat:no-repeat;
}
#super_container { 
 position:relative; 
 left:0px;
 top:42px;
 width:951px;
 background-image: url('../images/repeater_image.png');
 background-repeat:repeat-y; 
 padding-bottom: 40px;  
}
.container-foot { 
 width: 100%; 
 position: absolute; 
 bottom: 0 !important; 
 bottom: -1px; 
 height: 40px; 
}

html


<div class="page">   
   <div class="top_corners"></div>
   <div id="super_container">
    <div></div>
       
   </div>
   <div class="container-foot"></div>
 </div>