Tailwind CSS proporciona “ margen ” clases de utilidad que permiten a los usuarios controlar el espaciado alrededor de los elementos. El margen horizontal agrega espacio al lado izquierdo y derecho de un elemento, mientras que un margen vertical agrega espacio a la parte superior e inferior de un elemento. Tailwind ofrece varias clases de utilidad para agregar márgenes horizontales o verticales a los elementos deseados.
Este artículo ejemplificará:
¿Cómo agregar un margen horizontal en Tailwind?
Para agregar un margen horizontal a un elemento en Tailwind, el ' mx-
Sintaxis
< elemento clase = 'mx-
Aquí, “mx” representa el “eje x” o “margen horizontal”. Asegúrese de reemplazar '
Ejemplo: aplicar un margen horizontal a un elemento HTML
En este ejemplo, usaremos el ' mx-10 ” clase de utilidad con el “ Para agregar un margen vertical a un elemento en Tailwind, use el ' mi- Sintaxis Ejemplo: aplicar un margen vertical a un elemento HTML En este ejemplo, usaremos el ' mi-10 ” clase de utilidad con el “ Para agregar el margen horizontal y vertical en Tailwind, el ' mx-
< cuerpo >
< división clase = 'h-pantalla mx-10 bg-morado-500' >
< pag clase = 'texto-5xl texto-centro' > Margen en CSS viento de cola pag >
división >
cuerpo >
Producción 
El resultado anterior muestra el margen a los lados izquierdo y derecho del contenedor. Esto indica que el margen horizontal se ha aplicado correctamente al elemento contenedor. ¿Cómo agregar un margen vertical en Tailwind?
Aquí, 'my' representa el 'eje y' o 'margen vertical'. Asegúrese de reemplazar '
< división clase = 'h-96 my-10 bg-púrpura-500' >
< pag clase = 'texto-5xl texto-centro' > Margen en CSS viento de cola pag >
división >
cuerpo >
Producción 
El resultado anterior muestra el margen de los lados superior e inferior del contenedor. Esto indica que el margen vertical se ha aplicado efectivamente al elemento contenedor. Conclusión