Generador CSS de margin

Explora margin con controles interactivos por todos los lados, por lado o por eje, cambia unidades, compara propiedades físicas y lógicas y usa auto para desplazar o centrar el bloque.

Salida CSS

Abreviada Individual

Aplicación

Todos Individual Ejes

Sistema de propiedades

Las propiedades físicas se aplican directamente a los lados del elemento, mientras que las propiedades lógicas se aplican a los lados del elemento en función de la dirección del texto.

Físicas Lógicas

Unidad

Dirección del texto

Izquierda a derecha (ltr) Derecha a izquierda (rtl)

Todos los lados

Superior

Derecho

Usar auto

Inferior

Izquierdo

Usar auto

Horizontal

Usar auto

Vertical

margin

HTML

<div class="margin">
  <div>margin</div>
</div>

CSS

.margin {
  margin: 24px;
}