Ça devient ardu pour moi qui suis débutant.
Je ne peux que te proposer des pistes.
Dans quel(s) navigateur(s) as-tu testé ton code ?
IExplorer a tendance à ne pas respecter la norme et affiche certains éléments de manière fantaisiste.
Avant ton footer, essaye d'insérer une <div> avec “clear: both;” et une hauteur dedans, pour lui rendre service.
Si ça ne suffit pas, “clear: both;” aussi dans le footer. Ou encore “display: block;”.