Problema con la implementación de CSS Sticky Footer

Estoy teniendo algunos problemas para que el Pie de página pegajoso funcione en mi sitio. Si el contenido es más pequeño que la ventana, el pie de página debe permanecer en la parte inferior de la ventana y el espacio muerto se debe llenar con un div. creo que elCSS Sticky Footer hace esto, pero no puedo hacer que el "push div" funcione, empuje el contenido completamente hacia abajo. Como puede ver, mi código no es solo pie de envoltura corporal.

<body>
  <div id="banner-bg">
    <div id="wrapper">
      <div id="header-bg">
        <!-- header stuff -->
      </div> <!-- end header-bg -->
      <div id="content-bg">
        <div id="content">
          <!-- content stuff -->
        </div> <!-- end content -->
      </div> <!-- end content-bg -->
    </div> <!-- end wrapper -->
  </div> <!-- end banner-bg -->
</body>

body { 
    color:              #00FFFF;
    background-image:   url("Images/img.gif");
    font-size:          1em;
    font-weight:        normal;
    font-family:        verdana;
    text-align:         center;
    padding:            0;
    margin:             0;
}

#banner-bg {
    width:              100%;
    height:             9em;
    background-image:   url("Images/img2.gif"); background-repeat: repeat-x;
    position: absolute; top: 0;
}

#wrapper {
    width:              84em;
    margin-left:        auto; 
    margin-right:       auto;
}

#header-bg {
    height:             16em;
    background-image:   url("Images/header/header-bg.png"); 
}

#content-bg {
    background-image:   url("Images/img3.png"); background-repeat: repeat-y;
}

#content {
    margin-right:       2em; 
    margin-left:        2em;
}

Estoy confundido acerca de dónde debería ir el CSS Sticky Footer-code en mi caso.

Editar, aquí está lo que tengo y lo que quiero hacer:texto alternativo http://bayimg.com/image/gacniaacf.jpg

Respuestas a la pregunta(5)

Su respuesta a la pregunta