Arrêter le déplacement du bloc div

Question

Je n'arrive pas à contrôler la position des blocs div. Voici le code html.

<div id="d1"> 
    <div id="d2"> 
     <div id="d3" style="float:left" > 
      <img src="image.jpg" > 
     </div> 

     <div id="d4"> 
      Lorem Ipsum .... Dummy Text 
     </div> 
    </div> 
    <div id="d5"> 
     Stop this text from moving up 
    </div> 
</div> 

Je veux et d4 d3 pour être 2 colonnes parallèles et d5 devraient venir sous ces deux, un peu comme un pied de page dans la plupart des sites. Donc quand j'ajoute le style float: left à div d3, le texte d5 se déplace juste sous le texte "Lorem Ipsum". Comment puis-je avoir la colonne 2 fonctionnant, et faire la position de D5 fixe? C'est assez basique, mais je ne suis pas sûr de ce qui me manque.

Answer 1

Essayez d'ajouter un clear: both; à la div avec l'id 'd5'

dans votre CSS par exemple;

div#d5 
{ 
    clear:both; 
} 

plus d'informations sur cet attribut css se trouve here

Answer 2

Juste le 'float: left' ne pas faire l'affaire. Vous devrez ajouter une largeur ou quelque chose à # d3 et faire # d4 flottant (avec la largeur) aussi bien. # D5 aurait alors besoin d'un style comme 'clear: both;' pour le positionner sous la colonne # d3 & # d4. Si vous souhaitez le positionner en bas de l'écran du navigateur, ajoutez 'position: fixed; en bas: 0; ' De plus, la div # d2 n'est pas requise.