Apreniendo visualmente html y css

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.

APRENDE CSS DE FORMA VISUAL

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

Secciones

Border
Padding
Margin
Position Relative
Position Absolute

Position Fixed
Position Sticky

Display Block
Inline
Inline-Block

Overflow

Float

Display: Flex

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;}

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;}

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;}

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;}

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;}

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;}