Margins

Utilities to control the margins of the elements

Class	Properties
m-auto	margin: auto;

Margin

Class	Properties
m-xs	margin: var(--dash-size-xs);
m-sm	margin: var(--dash-size-sm);
m-md	margin: var(--dash-size-md);
m-lg	margin: var(--dash-size-lg);
m-xl	margin: var(--dash-size-xl);
m-2xl	margin: var(--dash-size-2xl);
m-3xl	margin: var(--dash-size-3xl);
m-4xl	margin: var(--dash-size-4xl);
m-5xl	margin: var(--dash-size-5xl);
m-6xl	margin: var(--dash-size-6xl);
m-7xl	margin: var(--dash-size-7xl);
m-8xl	margin: var(--dash-size-8xl);
m-9xl	margin: var(--dash-size-9xl);
m-full	margin: var(--dash-size-full);
m-screen	margin: var(--dash-size-screen);

Margin top

Class	Properties
mt-xs	margin-top: var(--dash-size-xs);
mt-sm	margin-top: var(--dash-size-sm);
mt-md	margin-top: var(--dash-size-md);
mt-lg	margin-top: var(--dash-size-lg);
mt-xl	margin-top: var(--dash-size-xl);
mt-2xl	margin-top: var(--dash-size-2xl);
mt-3xl	margin-top: var(--dash-size-3xl);
mt-4xl	margin-top: var(--dash-size-4xl);
mt-5xl	margin-top: var(--dash-size-5xl);
mt-6xl	margin-top: var(--dash-size-6xl);
mt-7xl	margin-top: var(--dash-size-7xl);
mt-8xl	margin-top: var(--dash-size-8xl);
mt-9xl	margin-top: var(--dash-size-9xl);
mt-full	margin-top: var(--dash-size-full);
mt-screen	margin-top: var(--dash-size-screen);

Margin bottom

Class	Properties
mb-xs	margin-bottom: var(--dash-size-xs);
mb-sm	margin-bottom: var(--dash-size-sm);
mb-md	margin-bottom: var(--dash-size-md);
mb-lg	margin-bottom: var(--dash-size-lg);
mb-xl	margin-bottom: var(--dash-size-xl);
mb-2xl	margin-bottom: var(--dash-size-2xl);
mb-3xl	margin-bottom: var(--dash-size-3xl);
mb-4xl	margin-bottom: var(--dash-size-4xl);
mb-5xl	margin-bottom: var(--dash-size-5xl);
mb-6xl	margin-bottom: var(--dash-size-6xl);
mb-7xl	margin-bottom: var(--dash-size-7xl);
mb-8xl	margin-bottom: var(--dash-size-8xl);
mb-9xl	margin-bottom: var(--dash-size-9xl);
mb-full	margin-bottom: var(--dash-size-full);
mb-screen	margin-bottom: var(--dash-size-screen);

Margin right

Class	Properties
mr-xs	margin-right: var(--dash-size-xs);
mr-sm	margin-right: var(--dash-size-sm);
mr-md	margin-right: var(--dash-size-md);
mr-lg	margin-right: var(--dash-size-lg);
mr-xl	margin-right: var(--dash-size-xl);
mr-2xl	margin-right: var(--dash-size-2xl);
mr-3xl	margin-right: var(--dash-size-3xl);
mr-4xl	margin-right: var(--dash-size-4xl);
mr-5xl	margin-right: var(--dash-size-5xl);
mr-6xl	margin-right: var(--dash-size-6xl);
mr-7xl	margin-right: var(--dash-size-7xl);
mr-8xl	margin-right: var(--dash-size-8xl);
mr-9xl	margin-right: var(--dash-size-9xl);
mr-full	margin-right: var(--dash-size-full);
mr-screen	margin-right: var(--dash-size-screen);

Margin left

Class	Properties
ml-xs	margin-left: var(--dash-size-xs);
ml-sm	margin-left: var(--dash-size-sm);
ml-md	margin-left: var(--dash-size-md);
ml-lg	margin-left: var(--dash-size-lg);
ml-xl	margin-left: var(--dash-size-xl);
ml-2xl	margin-left: var(--dash-size-2xl);
ml-3xl	margin-left: var(--dash-size-3xl);
ml-4xl	margin-left: var(--dash-size-4xl);
ml-5xl	margin-left: var(--dash-size-5xl);
ml-6xl	margin-left: var(--dash-size-6xl);
ml-7xl	margin-left: var(--dash-size-7xl);
ml-8xl	margin-left: var(--dash-size-8xl);
ml-9xl	margin-left: var(--dash-size-9xl);
ml-full	margin-left: var(--dash-size-full);
ml-screen	margin-left: var(--dash-size-screen);

Margin x

Class	Properties
mx-xs	margin-left: var(--dash-size-xs); margin-right: var(--dash-size-xs);
mx-sm	margin-left: var(--dash-size-sm); margin-right: var(--dash-size-sm);
mx-md	margin-left: var(--dash-size-md); margin-right: var(--dash-size-md);
mx-lg	margin-left: var(--dash-size-lg); margin-right: var(--dash-size-lg);
mx-xl	margin-left: var(--dash-size-xl); margin-right: var(--dash-size-xl);
mx-2xl	margin-left: var(--dash-size-2xl); margin-right: var(--dash-size-2xl);
mx-3xl	margin-left: var(--dash-size-3xl); margin-right: var(--dash-size-3xl);
mx-4xl	margin-left: var(--dash-size-4xl); margin-right: var(--dash-size-4xl);
mx-5xl	margin-left: var(--dash-size-5xl); margin-right: var(--dash-size-5xl);
mx-6xl	margin-left: var(--dash-size-6xl); margin-right: var(--dash-size-6xl);
mx-7xl	margin-left: var(--dash-size-7xl); margin-right: var(--dash-size-7xl);
mx-8xl	margin-left: var(--dash-size-8xl); margin-right: var(--dash-size-8xl);
mx-9xl	margin-left: var(--dash-size-9xl); margin-right: var(--dash-size-9xl);
mx-full	margin-left: var(--dash-size-full); margin-right: var(--dash-size-full);
mx-screen	margin-left: var(--dash-size-screen); margin-right var(--dash-size-screen);

Margin y

Class	Properties
my-xs	margin-top: var(--dash-size-xs); margin-bottom: var(--dash-size-xs);
my-sm	margin-top: var(--dash-size-sm); margin-bottom: var(--dash-size-sm);
my-md	margin-top: var(--dash-size-md); margin-bottom: var(--dash-size-md);
my-lg	margin-top: var(--dash-size-lg); margin-bottom: var(--dash-size-lg);
my-xl	margin-top: var(--dash-size-xl); margin-bottom: var(--dash-size-xl);
my-2xl	margin-top: var(--dash-size-2xl); margin-bottom: var(--dash-size-2xl);
my-3xl	margin-top: var(--dash-size-3xl); margin-bottom: var(--dash-size-3xl);
my-4xl	margin-top: var(--dash-size-4xl); margin-bottom: var(--dash-size-4xl);
my-5xl	margin-top: var(--dash-size-5xl); margin-bottom: var(--dash-size-5xl);
my-6xl	margin-top: var(--dash-size-6xl); margin-bottom: var(--dash-size-6xl);
my-7xl	margin-top: var(--dash-size-7xl); margin-bottom: var(--dash-size-7xl);
my-8xl	margin-top: var(--dash-size-8xl); margin-bottom: var(--dash-size-8xl);
my-9xl	margin-top: var(--dash-size-9xl); margin-bottom: var(--dash-size-9xl);
my-full	margin-top: var(--dash-size-full); margin-bottom: var(--dash-size-full);
my-screen	margin-top: var(--dash-size-screen); margin-bottom var(--dash-size-screen);