Un problema, clear: both? overflow: hidden?

[Jona_than]

Como ven este es el problema que quiero señalar en la imagen...realmente no se porque sucede, he estado probando de diferentes formas, y todavía no veo bien el problema en cuestión.

Les dejare el codigo CSS que ocupo

Código CSS:

#contenedor-abajo{
    width: 996px;
    margin: 0 auto;
}
#abajo{
    width: 100%;
    height: 104px;
    background: url(images/footer.png) repeat-x;
}
 

He intentado agregandole un monton de cosas, ejemplo clear: both, overflow: hidden, position: relative...

De hecho soluciono el problema, haciendo lo siguiente:

Código CSS:

#contenedor-abajo{
    width: 996px;
    margin: 0 auto;
    overflow: scroll;
}
#abajo{
    width: 100%;
    height: 104px;
    background: url(images/footer.png) repeat-x;
}
 

Pero el efecto visual, no es el mejor, así que quiero poder primero que me puedan ayudar, y segundo aprender, cual es el error que estoy cometiendo...

Saludos.