APRENDE CSS DE FORMA VISUAL

Explorá el diseño web a través de ejemplos visuales y claros

Secciones

 

Float Right:
.float1 {width: 550px; height:auto; background-color: tomato; border: 2px solid red; padding: 10px;}
#img1 {width: 200px; height:200px;margin-left: 10px;border: 4px solid blue; float: right;}

redsquare Este es un texto largo que se encuentra en el mismo contenedor de la imagen, por debajo de la misma en la línea de código. Este es un texto largo que se encuentra en el mismo contenedor de la imagen, por debajo de la misma en la línea de código. Este es un texto largo que se encuentra en el mismo contenedor de la imagen, por debajo de la misma en la línea de código. Este es un texto largo que se encuentra en el mismo contenedor de la imagen, por debajo de la misma en la línea de código. Este es un texto largo que se encuentra en el mismo contenedor de la imagen, por debajo de la misma en la línea de código. Este es un texto largo que se encuentra en el mismo contenedor de la imagen, por debajo de la misma en la línea de código.

 

Float Left:
.float2 {width: 550px; height:auto; background-color: tomato; border: 2px solid red; padding: 10px;}
#img2 {width: 200px; height:200px;margin-right: 10px;border: 4px solid blue; float: left;}

redsquare Este es un texto largo que se encuentra en el mismo contenedor de la imagen, por debajo de la misma en la línea de código. Este es un texto largo que se encuentra en el mismo contenedor de la imagen, por debajo de la misma en la línea de código. Este es un texto largo que se encuentra en el mismo contenedor de la imagen, por debajo de la misma en la línea de código. Este es un texto largo que se encuentra en el mismo contenedor de la imagen, por debajo de la misma en la línea de código. Este es un texto largo que se encuentra en el mismo contenedor de la imagen, por debajo de la misma en la línea de código. Este es un texto largo que se encuentra en el mismo contenedor de la imagen, por debajo de la misma en la línea de código.