Un footer chevauchant le haut de ma page

Bonjour à tous, je débute sur le positionnement visiblement.
J'ai une page presque convenable visuellement mais le footer traîne au milieu de ma page par dessus les autres. Pourtant il est intégré à une balise de type block...

Comment lui dire de se mettre après les autres balises, dans l'ordre du flux en fait ?

Mon code html contient beaucoup de texte alors je ne vais mettre que les balises de fin :

 </div> </div> <!-- fin des textes en trois colonnes qui marchent très bien -->
	<div class="spacer">
	      <hr align="center" width="100%" color="white" class="line">
	      <!-- une ligne pour mettre tout le reste dessous mais ça ne marche pas -->
	      <span class="black"> </span>
              <span class="white2"> <img src="lesailesbleues2010.png"/> </span>
              <span class="black"></span>
	</div>
</body>
</html>

Et la partie CSS :

.spacer {
      position:relative;
      display:block; 
	}
.black {
	background-color:#000000;
        float:left;
        width:318px;
        height:4px;
	}
.white2 {
      display:block;
      position:relative;
      background-color:#ffffff;
      float:left;
      width:340px;
      height:4px;
	}
.line {
      position:relative;
      display:block;
}

Merci d'avance pour votre aide. le résultat de mon incompétence en image ici > http://www.lesailesbleues.fr/cgv le footer est composé de deux bandes noires et des petites ailes au centre

Bonjour,

2 choses:

- Il n'y a pas besoin de mettre position:absolue dans le .text

- Il faut rajouter un clear:both dans le .spacer pour revenir dans le flux normal

Bonjour, d'abord un double merci : pour avoir répondu aussi vite ET aussi tôt un jour férié .

J'ai donc suivi vos conseils, le footer allait bien à sa place tout en bas mais cela décalait tout mon texte également. J'ai rajouté le même

clear:both;

à la place de

position:absolute;

et tout est devenu parfait.

Je peaufine donc les détails à présent :

Internet Explorer ne voit pas la favicon malgré le :

<link rel="icon" type="image/png" href="favicon.png" />
<link rel="shortcut icon" type="image/x-icon" href="icone_ie.ico" />

...dans le header

Merci.
Modifié par lesailesbleues (01 Nov 2010 - 15:00)