Ejercicio Práctico: Márgenes Personalizados

code

Código CSS

Cajas con márgenes personalizados

.contenedor {
border: 5px solid red;
}
.caja1 {
border: 5px solid green;
margin-top: 10px;
margin-left: 10px;
width: 50%;
}
.caja2 {
border: 5px solid blue;
margin-top: 10px;
margin-left: 50px;
width: 50%;
}
tips_and_updates

Los márgenes crean o eliminan espacio entre el elemento y el contenedor

view_in_ar

Resultado Visual

Cajas desplazadas por márgenes

Caja 1

margin-left: 10px

Caja 2

margin-left: 50px

Caja 3

margin-left: 100px

Los márgenes desplazan las cajas dentro del contenedor

Valores diferentes crean distintos espacios