Margin

Overview

These classes can be used to add a margin to elements on the screen. A margin is the space between the border of an element and the elements around it. It can be used to create space between elements. As a general rule, there should always be some space between elements to make the project easier to read and interact with.

Classes

Class	Description
m-0	Removes all a margin from the element.
m-1	Adds a margin to all sides of the element equal to 0.25rem.
m-2	Adds a margin to all sides of the element equal to 0.5rem.
m-3	Adds a margin to all sides of the element equal to 0.75rem.
m-4	Adds a margin to all sides of the element equal to 1rem.
m-5	Adds a margin to all sides of the element equal to 1.25rem.
m-6	Adds a margin to all sides of the element equal to 1.5rem.
m-8	Adds a margin to all sides of the element equal to 2rem.
m-10	Adds a margin to all sides of the element equal to 2.5rem.
m-12	Adds a margin to all sides of the element equal to 3rem.
m-16	Adds a margin to all sides of the element equal to 4rem.
m-20	Adds a margin to all sides of the element equal to 5rem.
m-24	Adds a margin to all sides of the element equal to 6rem.
m-32	Adds a margin to all sides of the element equal to 8rem.
m-40	Adds a margin to all sides of the element equal to 10rem.
m-48	Adds a margin to all sides of the element equal to 12rem.
m-56	Adds a margin to all sides of the element equal to 14rem.
m-64	Adds a margin to all sides of the element equal to 16rem.

Class	Description
mx-0	Removes horizontal a margin from the element.
mx-1	Adds horizontal a margin to the element equal to 0.25rem.
mx-2	Adds horizontal a margin to the element equal to 0.5rem.
mx-3	Adds horizontal a margin to the element equal to 0.75rem.
mx-4	Adds horizontal a margin to the element equal to 1rem.
mx-5	Adds horizontal a margin to the element equal to 1.25rem.
mx-6	Adds horizontal a margin to the element equal to 1.5rem.
mx-8	Adds horizontal a margin to the element equal to 2rem.
mx-10	Adds horizontal a margin to the element equal to 2.5rem.
mx-12	Adds horizontal a margin to the element equal to 3rem.
mx-16	Adds horizontal a margin to the element equal to 4rem.
mx-20	Adds horizontal a margin to the element equal to 5rem.
mx-24	Adds horizontal a margin to the element equal to 6rem.
mx-32	Adds horizontal a margin to the element equal to 8rem.
mx-40	Adds horizontal a margin to the element equal to 10rem.
mx-48	Adds horizontal a margin to the element equal to 12rem.
mx-56	Adds horizontal a margin to the element equal to 14rem.
mx-64	Adds horizontal a margin to the element equal to 16rem.

Class	Description
my-0	Removes vertical a margin from the element.
my-1	Adds vertical a margin to the element equal to 0.25rem.
my-2	Adds vertical a margin to the element equal to 0.5rem.
my-3	Adds vertical a margin to the element equal to 0.75rem.
my-4	Adds vertical a margin to the element equal to 1rem.
my-5	Adds vertical a margin to the element equal to 1.25rem.
my-6	Adds vertical a margin to the element equal to 1.5rem.
my-8	Adds vertical a margin to the element equal to 2rem.
my-10	Adds vertical a margin to the element equal to 2.5rem.
my-12	Adds vertical a margin to the element equal to 3rem.
my-16	Adds vertical a margin to the element equal to 4rem.
my-20	Adds vertical a margin to the element equal to 5rem.
my-24	Adds vertical a margin to the element equal to 6rem.
my-32	Adds vertical a margin to the element equal to 8rem.
my-40	Adds vertical a margin to the element equal to 10rem.
my-48	Adds vertical a margin to the element equal to 12rem.
my-56	Adds vertical a margin to the element equal to 14rem.
my-64	Adds vertical a margin to the element equal to 16rem.

Class	Description
mt-0	Removes top a margin from the element.
mt-1	Adds top a margin to the element equal to 0.25rem.
mt-2	Adds top a margin to the element equal to 0.5rem.
mt-3	Adds top a margin to the element equal to 0.75rem.
mt-4	Adds top a margin to the element equal to 1rem.
mt-5	Adds top a margin to the element equal to 1.25rem.
mt-6	Adds top a margin to the element equal to 1.5rem.
mt-8	Adds top a margin to the element equal to 2rem.
mt-10	Adds top a margin to the element equal to 2.5rem.
mt-12	Adds top a margin to the element equal to 3rem.
mt-16	Adds top a margin to the element equal to 4rem.
mt-20	Adds top a margin to the element equal to 5rem.
mt-24	Adds top a margin to the element equal to 6rem.
mt-32	Adds top a margin to the element equal to 8rem.
mt-40	Adds top a margin to the element equal to 10rem.
mt-48	Adds top a margin to the element equal to 12rem.
mt-56	Adds top a margin to the element equal to 14rem.
mt-64	Adds top a margin to the element equal to 16rem.

Class	Description
mr-0	Removes right a margin from the element.
mr-1	Adds right a margin to the element equal to 0.25rem.
mr-2	Adds right a margin to the element equal to 0.5rem.
mr-3	Adds right a margin to the element equal to 0.75rem.
mr-4	Adds right a margin to the element equal to 1rem.
mr-5	Adds right a margin to the element equal to 1.25rem.
mr-6	Adds right a margin to the element equal to 1.5rem.
mr-8	Adds right a margin to the element equal to 2rem.
mr-10	Adds right a margin to the element equal to 2.5rem.
mr-12	Adds right a margin to the element equal to 3rem.
mr-16	Adds right a margin to the element equal to 4rem.
mr-20	Adds right a margin to the element equal to 5rem.
mr-24	Adds right a margin to the element equal to 6rem.
mr-32	Adds right a margin to the element equal to 8rem.
mr-40	Adds right a margin to the element equal to 10rem.
mr-48	Adds right a margin to the element equal to 12rem.
mr-56	Adds right a margin to the element equal to 14rem.
mr-64	Adds right a margin to the element equal to 16rem.

Class	Description
mb-0	Removes bottom a margin from the element.
mb-1	Adds bottom a margin to the element equal to 0.25rem.
mb-2	Adds bottom a margin to the element equal to 0.5rem.
mb-3	Adds bottom a margin to the element equal to 0.75rem.
mb-4	Adds bottom a margin to the element equal to 1rem.
mb-5	Adds bottom a margin to the element equal to 1.25rem.
mb-6	Adds bottom a margin to the element equal to 1.5rem.
mb-8	Adds bottom a margin to the element equal to 2rem.
mb-10	Adds bottom a margin to the element equal to 2.5rem.
mb-12	Adds bottom a margin to the element equal to 3rem.
mb-16	Adds bottom a margin to the element equal to 4rem.
mb-20	Adds bottom a margin to the element equal to 5rem.
mb-24	Adds bottom a margin to the element equal to 6rem.
mb-32	Adds bottom a margin to the element equal to 8rem.
mb-40	Adds bottom a margin to the element equal to 10rem.
mb-48	Adds bottom a margin to the element equal to 12rem.
mb-56	Adds bottom a margin to the element equal to 14rem.
mb-64	Adds bottom a margin to the element equal to 16rem.

Class	Description
ml-0	Removes left a margin from the element.
ml-1	Adds left a margin to the element equal to 0.25rem.
ml-2	Adds left a margin to the element equal to 0.5rem.
ml-3	Adds left a margin to the element equal to 0.75rem.
ml-4	Adds left a margin to the element equal to 1rem.
ml-5	Adds left a margin to the element equal to 1.25rem.
ml-6	Adds left a margin to the element equal to 1.5rem.
ml-8	Adds left a margin to the element equal to 2rem.
ml-10	Adds left a margin to the element equal to 2.5rem.
ml-12	Adds left a margin to the element equal to 3rem.
ml-16	Adds left a margin to the element equal to 4rem.
ml-20	Adds left a margin to the element equal to 5rem.
ml-24	Adds left a margin to the element equal to 6rem.
ml-32	Adds left a margin to the element equal to 8rem.
ml-40	Adds left a margin to the element equal to 10rem.
ml-48	Adds left a margin to the element equal to 12rem.
ml-56	Adds left a margin to the element equal to 14rem.
ml-64	Adds left a margin to the element equal to 16rem.