Problema com a implementação do CSS Sticky Footer

Question

Jul 10, 2009, 11:29 PM

Problema com a implementação do CSS Sticky Footer

Estou com alguns problemas para conseguir que o Sticky Footer funcione no meu site. Se o conteúdo for menor que a janela, o rodapé deve ficar na parte inferior da janela e o espaço morto deve ser preenchido com um div. Eu acho que oRodapé pegajoso do CSS faz isso, mas eu não consigo colocar o "push div" para trabalhar o conteúdo todo o caminho. Como você pode ver, meu código não é apenas um wrapper de rodapé.

<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;
}

Estou confuso sobre onde o CSS Sticky Footer-code deve ir no meu caso.

Edit, aqui está o que eu tenho e o que eu quero fazer:alt text http://bayimg.com/image/gacniaacf.jpg