float

La propiedad float especifica si un elemento debe salir del flujo normal y aparecer a la izquierda o a la derecha de su contenedor, donde los elementos de texto y los en línea aparecerán a su alrededor.


Valores
left : El elemento flota a la izquierda de su bloque contenedor.
right : El elemento flota a la derecha de su bloque contenedor.
none : El elemento no flota.

si un elemento tiene la propiedad float distinta de none, es un elemento que flota, es decir, que no sigue el flujo normal de la pagina (imagina al elemento como un globo, que para posicionarlo tienes que decirle donde va a ir; en cambio un elemento block o inline si sigue el flujo ya sabe por naturaleza donde va estar colocado con float no)

Ejemplos:

imagen original, un div  y una imagen de un caballito de mar, que como tiene la propiedad float:none no se ve porque esta debajo del div







si cambiamos la propiedad z-index

img {
position:absolute;
z-index:2
}

o hacemos el div de color trasparente
img { background-color:transparent }

la imagen tiene la propiedad float:right
img { float:right }

la imagen tiene la propiedad float:left
nimg { float:left }







NO FUNCIONA EN ELEMENTOS CON POSICION ABSOLUTE