Tailwind CSS fornisce ' margine ” classi di utilità che consentono agli utenti di controllare la spaziatura attorno agli elementi. IL margine orizzontale aggiunge spazio al lato sinistro e destro di un elemento, mentre a margine verticale aggiunge spazio alla parte superiore e inferiore di un elemento. Tailwind offre varie classi di utilità per aggiungere margini orizzontali o verticali agli elementi desiderati.
Questo articolo esemplifica:
Come aggiungere un margine orizzontale in Tailwind?
Per aggiungere un margine orizzontale a un elemento in Tailwind, il ' mx-
Sintassi
< elemento classe = 'mx-
Qui, 'mx' rappresenta l''asse x' o 'margine orizzontale'. Assicurati di sostituire '
Esempio: applicazione di un margine orizzontale a un elemento HTML
In questo esempio, useremo il ' mx-10 ” classe di utilità con il “ Per aggiungere un margine verticale a un elemento in Tailwind, usa il ' mio- Sintassi Esempio: applicazione di un margine verticale a un elemento HTML In questo esempio, useremo il ' mio-10 ” classe di utilità con il “ Per aggiungere il margine orizzontale e verticale in Tailwind, il ' mx-
< corpo >
< div classe = 'h-screen mx-10 bg-viola-500' >
< P classe = 'centro testo testo-5xl' > Margine In CSS vento in coda P >
div >
corpo >
Produzione 
L'output sopra mostra il margine sui lati sinistro e destro del contenitore. Ciò indica che il margine orizzontale è stato applicato correttamente all'elemento contenitore. Come aggiungere un margine verticale in Tailwind?
Qui, 'my' rappresenta l''asse y' o 'margine verticale'. Assicurati di sostituire '
< div classe = 'h-96 my-10 bg-viola-500' >
< P classe = 'centro testo testo-5xl' > Margine In CSS vento in coda P >
div >
corpo >
Produzione 
L'output sopra mostra il margine sui lati superiore e inferiore del contenitore. Ciò indica che il margine verticale è stato effettivamente applicato all'elemento contenitore. Conclusione