Posicionamiento CSS

Despejando con CSS

La propiedad Clear, obliga desplazar los elementos flotantes de sus lados. despejando segun el valor de la propiedad.

Despejando un elemento flotante

Tenemos tres elementos flotantes

<div class="cuadro1">cuadro1 ...</div>
<div class="cuadro2">cuadro2 ...</div>
<div class="cuadro2">cuadro3 ...</div>

.cuadro1 {height:250px;width:290px;
          float:left;
          background-color:#FF8000;
          color:#ffffff;}
.cuadro2 {height:250px;width:290px;
          float:left;
          background-color:#0000FF;
          color:#ffffff;}
.cuadro3 {height:250px;width:290px;
          float:left;
          background-color:#008000;
          color:#ffffff;}

las tres cajas flotan horizontalmente.

Despejando el tercer bloque hacia abajo

Dentro de .cuadro3, añadimos la propiedad clear con valor both , para desplazar ese bloque hacia abajo.

.cuadro1 {height:250px;width:290px;
          float:left;
          background-color:#FF8000;
          color:#ffffff;}
.cuadro2 {height:250px;width:290px;
          float:left;
          background-color:#0000FF;
          color:#ffffff;}
.cuadro3 {height:250px;width:290px;
          float:left;clear:both;
          background-color:#008000;
          color:#ffffff;}