Problème de div height : auto;

Bonjour à tous
J'ai un problème que j'ai du mal à comprendre avec mon code CSS;

Je vais essayer d'être clair :

Voici le CSS de ma div principale :

.corps_site{
margin:auto;
width:960px;
height:auto;
margin-top:20px;
padding-bottom:20px;
border:1px solid black;
}

Comme vous pouvez le voir la hauteur est en auto car j'ai plusieurs éléments à rajouter dans le corps du site, dont un module de commentaires facebook, donc, à moins que quelqu'un ne me corrige là dessus, je suis obligé de mettre cette div "corps_site" en auto.

De plus j'ai un footer qui a ce code :

height:248px;
width:100%;
bottom:0px;
background:#000 url(../pics/bg_footer.jpg) repeat-x top left;
margin-top:60px;
color:#000;
}

Voici le problème :
la div "corps_site" fonctionne mal en valeur "heigt:auto".
En gros elle n'englobe pas tous les éléments du corps du site et s'arrête grossomodo à 200px de hauteur. Tous les éléments "sortent" donc de cette div et le plus grave étant que du coup mon footer ne se trouve plus du tout à sa place mais au centre de la page.

Voilà un screen réalisé pour mieux comprendre
(j'ai fait exprès de mettre une bordure à la div "corps_site" afin qu'on puisse voir comment elle réagit.

le screenshot

Le grand cadre dégradé noir est le footer qui se retrouve à cette endroit de la page.

Merci d'avance à ceux ou celles qui pourront m'aider.