content box positioning

[Bazzaah]

I'm a bit confused with some CSS I've been doing and wondered if someone could help me out please.

 

I have my header and footer in place;

 

html,
body {
   background: #2c539e;
   font-size: 100%;
   margin:0;
   padding:0;
   height:100%;
}

/* container */

#centered {
   min-height:100%;
   position:relative;
   margin: 20px auto;

}
/* header and footer*/

#header {
   background:#ff0;
   margin-top: 10px;
}

#footer {
   position:absolute;
   bottom:0;
   width:100%;
   height: 60px;  
   margin-bottom: 10px;
}

 

 

The content is contained in a couple of (nested?) boxes.

 

#frontpagecentered{
  margin-top: 240px;
  position: absolute;
  width: 950px;
  left: 50%;
  margin-left: -475px; 
  margin-right:auto;
  background-color: #9abdde;
  padding-top: 30px;
  padding-bottom: 30px;
  	-moz-border-radius: 15px;
border-radius: 15px;

}

#box {

   padding:10px 10px 10px 10px;
   padding-bottom:60px;   /* Height of the footer */
   width: 900px;
   background-color: #F0F2F7;
   font-size: 1.1em;
   font-family: Century Gothic,Myriad Pro,Arial,Helvetica,sans-serif;
   -moz-border-radius: 15px;
   border-radius: 15px;
   margin-left: 10px;
   margin-right: 10px;
}

 

Is there a layout I can use so that I can add a new box in the relevant file and have the boxes automatically one beneath the other?

 

Thanks in advance for any help

[Bazzaah]

changed position to relative on #frontpagecentered and that seems to have sorted it.