Margin


Class reference

ClassProperties
.-m-96margin: -24rem;
.-m-80margin: -20rem;
.-m-72margin: -18rem;
.-m-64margin: -16rem;
.-m-60margin: -15rem;
.-m-56margin: -14rem;
.-m-48margin: -12rem;
.-m-40margin: -10rem;
.-m-36margin: -9rem;
.-m-32margin: -8rem;
.-m-28margin: -7rem;
.-m-24margin: -6rem;
.-m-20margin: -5rem;
.-m-18margin: -4.5rem;
.-m-16margin: -4rem;
.-m-15margin: -3.75rem;
.-m-14margin: -3.5rem;
.-m-13margin: -3.25rem;
.-m-12margin: -3rem;
.-m-11margin: -2.75rem;
.-m-10margin: -2.5rem;
.-m-9margin: -2.25rem;
.-m-8margin: -2rem;
.-m-7margin: -1.75rem;
.-m-6margin: -1.5rem;
.-m-5margin: -1.25rem;
.-m-4.5margin: -1.125rem;
.-m-4margin: -1rem;
.-m-3.5margin: -0.875rem;
.-m-3margin: -0.75rem;
.-m-2.5margin: -0.625rem;
.-m-2margin: -0.5rem;
.-m-1.5margin: -0.375rem;
.-m-1margin: -0.25rem;
.-m-0.5margin: -0.125rem;
.-m-pxmargin: -1px;
.m-automargin: auto;
.m-0margin: 0;
.m-pxmargin: 1px;
.m-0.5margin: 0.125rem;
.m-1margin: 0.25rem;
.m-1.5margin: 0.375rem;
.m-2margin: 0.5rem;
.m-2.5margin: 0.625rem;
.m-3margin: 0.75rem;
.m-3.5margin: 0.875rem;
.m-4margin: 1rem;
.m-4.5margin: 1.125rem;
.m-5margin: 1.25rem;
.m-6margin: 1.5rem;
.m-7margin: 1.75rem;
.m-8margin: 2rem;
.m-9margin: 2.25rem;
.m-10margin: 2.5rem;
.m-11margin: 2.75rem;
.m-12margin: 3rem;
.m-13margin: 3.25rem;
.m-14margin: 3.5rem;
.m-15margin: 3.75rem;
.m-16margin: 4rem;
.m-18margin: 4.5rem;
.m-20margin: 5rem;
.m-24margin: 6rem;
.m-28margin: 7rem;
.m-32margin: 8rem;
.m-36margin: 9rem;
.m-40margin: 10rem;
.m-48margin: 12rem;
.m-56margin: 14rem;
.m-60margin: 15rem;
.m-64margin: 16rem;
.m-72margin: 18rem;
.m-80margin: 20rem;
.m-96margin: 24rem;
.m-1/4margin: 25%;
.m-1/2margin: 50%;
.m-3/4margin: 75%;
.m-fullmargin: 100%;
.-mx-96margin-left: -24rem; margin-right: -24rem;
.-my-96margin-top: -24rem; margin-bottom: -24rem;
.-mt-96margin-top: -24rem;
.-mr-96margin-right: -24rem;
.-mb-96margin-bottom: -24rem;
.-ml-96margin-left: -24rem;
.-mx-80margin-left: -20rem; margin-right: -20rem;
.-my-80margin-top: -20rem; margin-bottom: -20rem;
.-mt-80margin-top: -20rem;
.-mr-80margin-right: -20rem;
.-mb-80margin-bottom: -20rem;
.-ml-80margin-left: -20rem;
.-mx-72margin-left: -18rem; margin-right: -18rem;
.-my-72margin-top: -18rem; margin-bottom: -18rem;
.-mt-72margin-top: -18rem;
.-mr-72margin-right: -18rem;
.-mb-72margin-bottom: -18rem;
.-ml-72margin-left: -18rem;
.-mx-64margin-left: -16rem; margin-right: -16rem;
.-my-64margin-top: -16rem; margin-bottom: -16rem;
.-mt-64margin-top: -16rem;
.-mr-64margin-right: -16rem;
.-mb-64margin-bottom: -16rem;
.-ml-64margin-left: -16rem;
.-mx-60margin-left: -15rem; margin-right: -15rem;
.-my-60margin-top: -15rem; margin-bottom: -15rem;
.-mt-60margin-top: -15rem;
.-mr-60margin-right: -15rem;
.-mb-60margin-bottom: -15rem;
.-ml-60margin-left: -15rem;
.-mx-56margin-left: -14rem; margin-right: -14rem;
.-my-56margin-top: -14rem; margin-bottom: -14rem;
.-mt-56margin-top: -14rem;
.-mr-56margin-right: -14rem;
.-mb-56margin-bottom: -14rem;
.-ml-56margin-left: -14rem;
.-mx-48margin-left: -12rem; margin-right: -12rem;
.-my-48margin-top: -12rem; margin-bottom: -12rem;
.-mt-48margin-top: -12rem;
.-mr-48margin-right: -12rem;
.-mb-48margin-bottom: -12rem;
.-ml-48margin-left: -12rem;
.-mx-40margin-left: -10rem; margin-right: -10rem;
.-my-40margin-top: -10rem; margin-bottom: -10rem;
.-mt-40margin-top: -10rem;
.-mr-40margin-right: -10rem;
.-mb-40margin-bottom: -10rem;
.-ml-40margin-left: -10rem;
.-mx-36margin-left: -9rem; margin-right: -9rem;
.-my-36margin-top: -9rem; margin-bottom: -9rem;
.-mt-36margin-top: -9rem;
.-mr-36margin-right: -9rem;
.-mb-36margin-bottom: -9rem;
.-ml-36margin-left: -9rem;
.-mx-32margin-left: -8rem; margin-right: -8rem;
.-my-32margin-top: -8rem; margin-bottom: -8rem;
.-mt-32margin-top: -8rem;
.-mr-32margin-right: -8rem;
.-mb-32margin-bottom: -8rem;
.-ml-32margin-left: -8rem;
.-mx-28margin-left: -7rem; margin-right: -7rem;
.-my-28margin-top: -7rem; margin-bottom: -7rem;
.-mt-28margin-top: -7rem;
.-mr-28margin-right: -7rem;
.-mb-28margin-bottom: -7rem;
.-ml-28margin-left: -7rem;
.-mx-24margin-left: -6rem; margin-right: -6rem;
.-my-24margin-top: -6rem; margin-bottom: -6rem;
.-mt-24margin-top: -6rem;
.-mr-24margin-right: -6rem;
.-mb-24margin-bottom: -6rem;
.-ml-24margin-left: -6rem;
.-mx-20margin-left: -5rem; margin-right: -5rem;
.-my-20margin-top: -5rem; margin-bottom: -5rem;
.-mt-20margin-top: -5rem;
.-mr-20margin-right: -5rem;
.-mb-20margin-bottom: -5rem;
.-ml-20margin-left: -5rem;
.-mx-18margin-left: -4.5rem; margin-right: -4.5rem;
.-my-18margin-top: -4.5rem; margin-bottom: -4.5rem;
.-mt-18margin-top: -4.5rem;
.-mr-18margin-right: -4.5rem;
.-mb-18margin-bottom: -4.5rem;
.-ml-18margin-left: -4.5rem;
.-mx-16margin-left: -4rem; margin-right: -4rem;
.-my-16margin-top: -4rem; margin-bottom: -4rem;
.-mt-16margin-top: -4rem;
.-mr-16margin-right: -4rem;
.-mb-16margin-bottom: -4rem;
.-ml-16margin-left: -4rem;
.-mx-15margin-left: -3.75rem; margin-right: -3.75rem;
.-my-15margin-top: -3.75rem; margin-bottom: -3.75rem;
.-mt-15margin-top: -3.75rem;
.-mr-15margin-right: -3.75rem;
.-mb-15margin-bottom: -3.75rem;
.-ml-15margin-left: -3.75rem;
.-mx-14margin-left: -3.5rem; margin-right: -3.5rem;
.-my-14margin-top: -3.5rem; margin-bottom: -3.5rem;
.-mt-14margin-top: -3.5rem;
.-mr-14margin-right: -3.5rem;
.-mb-14margin-bottom: -3.5rem;
.-ml-14margin-left: -3.5rem;
.-mx-13margin-left: -3.25rem; margin-right: -3.25rem;
.-my-13margin-top: -3.25rem; margin-bottom: -3.25rem;
.-mt-13margin-top: -3.25rem;
.-mr-13margin-right: -3.25rem;
.-mb-13margin-bottom: -3.25rem;
.-ml-13margin-left: -3.25rem;
.-mx-12margin-left: -3rem; margin-right: -3rem;
.-my-12margin-top: -3rem; margin-bottom: -3rem;
.-mt-12margin-top: -3rem;
.-mr-12margin-right: -3rem;
.-mb-12margin-bottom: -3rem;
.-ml-12margin-left: -3rem;
.-mx-11margin-left: -2.75rem; margin-right: -2.75rem;
.-my-11margin-top: -2.75rem; margin-bottom: -2.75rem;
.-mt-11margin-top: -2.75rem;
.-mr-11margin-right: -2.75rem;
.-mb-11margin-bottom: -2.75rem;
.-ml-11margin-left: -2.75rem;
.-mx-10margin-left: -2.5rem; margin-right: -2.5rem;
.-my-10margin-top: -2.5rem; margin-bottom: -2.5rem;
.-mt-10margin-top: -2.5rem;
.-mr-10margin-right: -2.5rem;
.-mb-10margin-bottom: -2.5rem;
.-ml-10margin-left: -2.5rem;
.-mx-9margin-left: -2.25rem; margin-right: -2.25rem;
.-my-9margin-top: -2.25rem; margin-bottom: -2.25rem;
.-mt-9margin-top: -2.25rem;
.-mr-9margin-right: -2.25rem;
.-mb-9margin-bottom: -2.25rem;
.-ml-9margin-left: -2.25rem;
.-mx-8margin-left: -2rem; margin-right: -2rem;
.-my-8margin-top: -2rem; margin-bottom: -2rem;
.-mt-8margin-top: -2rem;
.-mr-8margin-right: -2rem;
.-mb-8margin-bottom: -2rem;
.-ml-8margin-left: -2rem;
.-mx-7margin-left: -1.75rem; margin-right: -1.75rem;
.-my-7margin-top: -1.75rem; margin-bottom: -1.75rem;
.-mt-7margin-top: -1.75rem;
.-mr-7margin-right: -1.75rem;
.-mb-7margin-bottom: -1.75rem;
.-ml-7margin-left: -1.75rem;
.-mx-6margin-left: -1.5rem; margin-right: -1.5rem;
.-my-6margin-top: -1.5rem; margin-bottom: -1.5rem;
.-mt-6margin-top: -1.5rem;
.-mr-6margin-right: -1.5rem;
.-mb-6margin-bottom: -1.5rem;
.-ml-6margin-left: -1.5rem;
.-mx-5margin-left: -1.25rem; margin-right: -1.25rem;
.-my-5margin-top: -1.25rem; margin-bottom: -1.25rem;
.-mt-5margin-top: -1.25rem;
.-mr-5margin-right: -1.25rem;
.-mb-5margin-bottom: -1.25rem;
.-ml-5margin-left: -1.25rem;
.-mx-4.5margin-left: -1.125rem; margin-right: -1.125rem;
.-my-4.5margin-top: -1.125rem; margin-bottom: -1.125rem;
.-mt-4.5margin-top: -1.125rem;
.-mr-4.5margin-right: -1.125rem;
.-mb-4.5margin-bottom: -1.125rem;
.-ml-4.5margin-left: -1.125rem;
.-mx-4margin-left: -1rem; margin-right: -1rem;
.-my-4margin-top: -1rem; margin-bottom: -1rem;
.-mt-4margin-top: -1rem;
.-mr-4margin-right: -1rem;
.-mb-4margin-bottom: -1rem;
.-ml-4margin-left: -1rem;
.-mx-3.5margin-left: -0.875rem; margin-right: -0.875rem;
.-my-3.5margin-top: -0.875rem; margin-bottom: -0.875rem;
.-mt-3.5margin-top: -0.875rem;
.-mr-3.5margin-right: -0.875rem;
.-mb-3.5margin-bottom: -0.875rem;
.-ml-3.5margin-left: -0.875rem;
.-mx-3margin-left: -0.75rem; margin-right: -0.75rem;
.-my-3margin-top: -0.75rem; margin-bottom: -0.75rem;
.-mt-3margin-top: -0.75rem;
.-mr-3margin-right: -0.75rem;
.-mb-3margin-bottom: -0.75rem;
.-ml-3margin-left: -0.75rem;
.-mx-2.5margin-left: -0.625rem; margin-right: -0.625rem;
.-my-2.5margin-top: -0.625rem; margin-bottom: -0.625rem;
.-mt-2.5margin-top: -0.625rem;
.-mr-2.5margin-right: -0.625rem;
.-mb-2.5margin-bottom: -0.625rem;
.-ml-2.5margin-left: -0.625rem;
.-mx-2margin-left: -0.5rem; margin-right: -0.5rem;
.-my-2margin-top: -0.5rem; margin-bottom: -0.5rem;
.-mt-2margin-top: -0.5rem;
.-mr-2margin-right: -0.5rem;
.-mb-2margin-bottom: -0.5rem;
.-ml-2margin-left: -0.5rem;
.-mx-1.5margin-left: -0.375rem; margin-right: -0.375rem;
.-my-1.5margin-top: -0.375rem; margin-bottom: -0.375rem;
.-mt-1.5margin-top: -0.375rem;
.-mr-1.5margin-right: -0.375rem;
.-mb-1.5margin-bottom: -0.375rem;
.-ml-1.5margin-left: -0.375rem;
.-mx-1margin-left: -0.25rem; margin-right: -0.25rem;
.-my-1margin-top: -0.25rem; margin-bottom: -0.25rem;
.-mt-1margin-top: -0.25rem;
.-mr-1margin-right: -0.25rem;
.-mb-1margin-bottom: -0.25rem;
.-ml-1margin-left: -0.25rem;
.-mx-0.5margin-left: -0.125rem; margin-right: -0.125rem;
.-my-0.5margin-top: -0.125rem; margin-bottom: -0.125rem;
.-mt-0.5margin-top: -0.125rem;
.-mr-0.5margin-right: -0.125rem;
.-mb-0.5margin-bottom: -0.125rem;
.-ml-0.5margin-left: -0.125rem;
.-mx-pxmargin-left: -1px; margin-right: -1px;
.-my-pxmargin-top: -1px; margin-bottom: -1px;
.-mt-pxmargin-top: -1px;
.-mr-pxmargin-right: -1px;
.-mb-pxmargin-bottom: -1px;
.-ml-pxmargin-left: -1px;
.mx-automargin-left: auto; margin-right: auto;
.my-automargin-top: auto; margin-bottom: auto;
.mt-automargin-top: auto;
.mr-automargin-right: auto;
.mb-automargin-bottom: auto;
.ml-automargin-left: auto;
.mx-0margin-left: 0; margin-right: 0;
.my-0margin-top: 0; margin-bottom: 0;
.mt-0margin-top: 0;
.mr-0margin-right: 0;
.mb-0margin-bottom: 0;
.ml-0margin-left: 0;
.mx-pxmargin-left: 1px; margin-right: 1px;
.my-pxmargin-top: 1px; margin-bottom: 1px;
.mt-pxmargin-top: 1px;
.mr-pxmargin-right: 1px;
.mb-pxmargin-bottom: 1px;
.ml-pxmargin-left: 1px;
.mx-0.5margin-left: 0.125rem; margin-right: 0.125rem;
.my-0.5margin-top: 0.125rem; margin-bottom: 0.125rem;
.mt-0.5margin-top: 0.125rem;
.mr-0.5margin-right: 0.125rem;
.mb-0.5margin-bottom: 0.125rem;
.ml-0.5margin-left: 0.125rem;
.mx-1margin-left: 0.25rem; margin-right: 0.25rem;
.my-1margin-top: 0.25rem; margin-bottom: 0.25rem;
.mt-1margin-top: 0.25rem;
.mr-1margin-right: 0.25rem;
.mb-1margin-bottom: 0.25rem;
.ml-1margin-left: 0.25rem;
.mx-1.5margin-left: 0.375rem; margin-right: 0.375rem;
.my-1.5margin-top: 0.375rem; margin-bottom: 0.375rem;
.mt-1.5margin-top: 0.375rem;
.mr-1.5margin-right: 0.375rem;
.mb-1.5margin-bottom: 0.375rem;
.ml-1.5margin-left: 0.375rem;
.mx-2margin-left: 0.5rem; margin-right: 0.5rem;
.my-2margin-top: 0.5rem; margin-bottom: 0.5rem;
.mt-2margin-top: 0.5rem;
.mr-2margin-right: 0.5rem;
.mb-2margin-bottom: 0.5rem;
.ml-2margin-left: 0.5rem;
.mx-2.5margin-left: 0.625rem; margin-right: 0.625rem;
.my-2.5margin-top: 0.625rem; margin-bottom: 0.625rem;
.mt-2.5margin-top: 0.625rem;
.mr-2.5margin-right: 0.625rem;
.mb-2.5margin-bottom: 0.625rem;
.ml-2.5margin-left: 0.625rem;
.mx-3margin-left: 0.75rem; margin-right: 0.75rem;
.my-3margin-top: 0.75rem; margin-bottom: 0.75rem;
.mt-3margin-top: 0.75rem;
.mr-3margin-right: 0.75rem;
.mb-3margin-bottom: 0.75rem;
.ml-3margin-left: 0.75rem;
.mx-3.5margin-left: 0.875rem; margin-right: 0.875rem;
.my-3.5margin-top: 0.875rem; margin-bottom: 0.875rem;
.mt-3.5margin-top: 0.875rem;
.mr-3.5margin-right: 0.875rem;
.mb-3.5margin-bottom: 0.875rem;
.ml-3.5margin-left: 0.875rem;
.mx-4margin-left: 1rem; margin-right: 1rem;
.my-4margin-top: 1rem; margin-bottom: 1rem;
.mt-4margin-top: 1rem;
.mr-4margin-right: 1rem;
.mb-4margin-bottom: 1rem;
.ml-4margin-left: 1rem;
.mx-4.5margin-left: 1.125rem; margin-right: 1.125rem;
.my-4.5margin-top: 1.125rem; margin-bottom: 1.125rem;
.mt-4.5margin-top: 1.125rem;
.mr-4.5margin-right: 1.125rem;
.mb-4.5margin-bottom: 1.125rem;
.ml-4.5margin-left: 1.125rem;
.mx-5margin-left: 1.25rem; margin-right: 1.25rem;
.my-5margin-top: 1.25rem; margin-bottom: 1.25rem;
.mt-5margin-top: 1.25rem;
.mr-5margin-right: 1.25rem;
.mb-5margin-bottom: 1.25rem;
.ml-5margin-left: 1.25rem;
.mx-6margin-left: 1.5rem; margin-right: 1.5rem;
.my-6margin-top: 1.5rem; margin-bottom: 1.5rem;
.mt-6margin-top: 1.5rem;
.mr-6margin-right: 1.5rem;
.mb-6margin-bottom: 1.5rem;
.ml-6margin-left: 1.5rem;
.mx-7margin-left: 1.75rem; margin-right: 1.75rem;
.my-7margin-top: 1.75rem; margin-bottom: 1.75rem;
.mt-7margin-top: 1.75rem;
.mr-7margin-right: 1.75rem;
.mb-7margin-bottom: 1.75rem;
.ml-7margin-left: 1.75rem;
.mx-8margin-left: 2rem; margin-right: 2rem;
.my-8margin-top: 2rem; margin-bottom: 2rem;
.mt-8margin-top: 2rem;
.mr-8margin-right: 2rem;
.mb-8margin-bottom: 2rem;
.ml-8margin-left: 2rem;
.mx-9margin-left: 2.25rem; margin-right: 2.25rem;
.my-9margin-top: 2.25rem; margin-bottom: 2.25rem;
.mt-9margin-top: 2.25rem;
.mr-9margin-right: 2.25rem;
.mb-9margin-bottom: 2.25rem;
.ml-9margin-left: 2.25rem;
.mx-10margin-left: 2.5rem; margin-right: 2.5rem;
.my-10margin-top: 2.5rem; margin-bottom: 2.5rem;
.mt-10margin-top: 2.5rem;
.mr-10margin-right: 2.5rem;
.mb-10margin-bottom: 2.5rem;
.ml-10margin-left: 2.5rem;
.mx-11margin-left: 2.75rem; margin-right: 2.75rem;
.my-11margin-top: 2.75rem; margin-bottom: 2.75rem;
.mt-11margin-top: 2.75rem;
.mr-11margin-right: 2.75rem;
.mb-11margin-bottom: 2.75rem;
.ml-11margin-left: 2.75rem;
.mx-12margin-left: 3rem; margin-right: 3rem;
.my-12margin-top: 3rem; margin-bottom: 3rem;
.mt-12margin-top: 3rem;
.mr-12margin-right: 3rem;
.mb-12margin-bottom: 3rem;
.ml-12margin-left: 3rem;
.mx-13margin-left: 3.25rem; margin-right: 3.25rem;
.my-13margin-top: 3.25rem; margin-bottom: 3.25rem;
.mt-13margin-top: 3.25rem;
.mr-13margin-right: 3.25rem;
.mb-13margin-bottom: 3.25rem;
.ml-13margin-left: 3.25rem;
.mx-14margin-left: 3.5rem; margin-right: 3.5rem;
.my-14margin-top: 3.5rem; margin-bottom: 3.5rem;
.mt-14margin-top: 3.5rem;
.mr-14margin-right: 3.5rem;
.mb-14margin-bottom: 3.5rem;
.ml-14margin-left: 3.5rem;
.mx-15margin-left: 3.75rem; margin-right: 3.75rem;
.my-15margin-top: 3.75rem; margin-bottom: 3.75rem;
.mt-15margin-top: 3.75rem;
.mr-15margin-right: 3.75rem;
.mb-15margin-bottom: 3.75rem;
.ml-15margin-left: 3.75rem;
.mx-16margin-left: 4rem; margin-right: 4rem;
.my-16margin-top: 4rem; margin-bottom: 4rem;
.mt-16margin-top: 4rem;
.mr-16margin-right: 4rem;
.mb-16margin-bottom: 4rem;
.ml-16margin-left: 4rem;
.mx-18margin-left: 4.5rem; margin-right: 4.5rem;
.my-18margin-top: 4.5rem; margin-bottom: 4.5rem;
.mt-18margin-top: 4.5rem;
.mr-18margin-right: 4.5rem;
.mb-18margin-bottom: 4.5rem;
.ml-18margin-left: 4.5rem;
.mx-20margin-left: 5rem; margin-right: 5rem;
.my-20margin-top: 5rem; margin-bottom: 5rem;
.mt-20margin-top: 5rem;
.mr-20margin-right: 5rem;
.mb-20margin-bottom: 5rem;
.ml-20margin-left: 5rem;
.mx-24margin-left: 6rem; margin-right: 6rem;
.my-24margin-top: 6rem; margin-bottom: 6rem;
.mt-24margin-top: 6rem;
.mr-24margin-right: 6rem;
.mb-24margin-bottom: 6rem;
.ml-24margin-left: 6rem;
.mx-28margin-left: 7rem; margin-right: 7rem;
.my-28margin-top: 7rem; margin-bottom: 7rem;
.mt-28margin-top: 7rem;
.mr-28margin-right: 7rem;
.mb-28margin-bottom: 7rem;
.ml-28margin-left: 7rem;
.mx-32margin-left: 8rem; margin-right: 8rem;
.my-32margin-top: 8rem; margin-bottom: 8rem;
.mt-32margin-top: 8rem;
.mr-32margin-right: 8rem;
.mb-32margin-bottom: 8rem;
.ml-32margin-left: 8rem;
.mx-36margin-left: 9rem; margin-right: 9rem;
.my-36margin-top: 9rem; margin-bottom: 9rem;
.mt-36margin-top: 9rem;
.mr-36margin-right: 9rem;
.mb-36margin-bottom: 9rem;
.ml-36margin-left: 9rem;
.mx-40margin-left: 10rem; margin-right: 10rem;
.my-40margin-top: 10rem; margin-bottom: 10rem;
.mt-40margin-top: 10rem;
.mr-40margin-right: 10rem;
.mb-40margin-bottom: 10rem;
.ml-40margin-left: 10rem;
.mx-48margin-left: 12rem; margin-right: 12rem;
.my-48margin-top: 12rem; margin-bottom: 12rem;
.mt-48margin-top: 12rem;
.mr-48margin-right: 12rem;
.mb-48margin-bottom: 12rem;
.ml-48margin-left: 12rem;
.mx-56margin-left: 14rem; margin-right: 14rem;
.my-56margin-top: 14rem; margin-bottom: 14rem;
.mt-56margin-top: 14rem;
.mr-56margin-right: 14rem;
.mb-56margin-bottom: 14rem;
.ml-56margin-left: 14rem;
.mx-60margin-left: 15rem; margin-right: 15rem;
.my-60margin-top: 15rem; margin-bottom: 15rem;
.mt-60margin-top: 15rem;
.mr-60margin-right: 15rem;
.mb-60margin-bottom: 15rem;
.ml-60margin-left: 15rem;
.mx-64margin-left: 16rem; margin-right: 16rem;
.my-64margin-top: 16rem; margin-bottom: 16rem;
.mt-64margin-top: 16rem;
.mr-64margin-right: 16rem;
.mb-64margin-bottom: 16rem;
.ml-64margin-left: 16rem;
.mx-72margin-left: 18rem; margin-right: 18rem;
.my-72margin-top: 18rem; margin-bottom: 18rem;
.mt-72margin-top: 18rem;
.mr-72margin-right: 18rem;
.mb-72margin-bottom: 18rem;
.ml-72margin-left: 18rem;
.mx-80margin-left: 20rem; margin-right: 20rem;
.my-80margin-top: 20rem; margin-bottom: 20rem;
.mt-80margin-top: 20rem;
.mr-80margin-right: 20rem;
.mb-80margin-bottom: 20rem;
.ml-80margin-left: 20rem;
.mx-96margin-left: 24rem; margin-right: 24rem;
.my-96margin-top: 24rem; margin-bottom: 24rem;
.mt-96margin-top: 24rem;
.mr-96margin-right: 24rem;
.mb-96margin-bottom: 24rem;
.ml-96margin-left: 24rem;
.mx-1/4margin-left: 25%; margin-right: 25%;
.my-1/4margin-top: 25%; margin-bottom: 25%;
.mt-1/4margin-top: 25%;
.mr-1/4margin-right: 25%;
.mb-1/4margin-bottom: 25%;
.ml-1/4margin-left: 25%;
.mx-1/2margin-left: 50%; margin-right: 50%;
.my-1/2margin-top: 50%; margin-bottom: 50%;
.mt-1/2margin-top: 50%;
.mr-1/2margin-right: 50%;
.mb-1/2margin-bottom: 50%;
.ml-1/2margin-left: 50%;
.mx-3/4margin-left: 75%; margin-right: 75%;
.my-3/4margin-top: 75%; margin-bottom: 75%;
.mt-3/4margin-top: 75%;
.mr-3/4margin-right: 75%;
.mb-3/4margin-bottom: 75%;
.ml-3/4margin-left: 75%;
.mx-fullmargin-left: 100%; margin-right: 100%;
.my-fullmargin-top: 100%; margin-bottom: 100%;
.mt-fullmargin-top: 100%;
.mr-fullmargin-right: 100%;
.mb-fullmargin-bottom: 100%;
.ml-fullmargin-left: 100%;

Add margin to a single side

Control the margin on one side of an element using the m{t|r|b|l}-{size} utilities.

For exammle, mt-6 would add 1.5rem of margin to the top of an element, mr-4 would add 1rem of margin to the right of an element, mb-8 would add 2rem of margin to the bottom of an element, and ml-2 would add 0.5rem of margin to the left of an element.

mt-8
mr-8
mb-8
ml-8
<div class="mt-8 ...">mt-8</div>
<div class="mr-8 ...">mr-8</div>
<div class="mb-8 ...">mb-8</div>
<div class="ml-8 ...">ml-8</div>

Add horizontal margin

Control the horizontal margin of an element using the mx-{size} utilities.

mx-8
<div class="mx-8 ...">mx-8</div>

Add vertical margin

Control the vertical margin of an element using the my-{size} utilities.

my-8
<div class="my-8 ...">my-8</div>

Add margin to all sides

Control the margin on all sides of an element using the m-{size} utilities.

m-8
<div class="m-8 ...">m-8</div>

Negative margins

Control the negative margin of an element using the -m{side?}-{size} utilities.

-mt-8
<div class="w-32 h-16 bg-red-100 ..."></div>
<div class="-mt-8 bg-red ...">-mt-8</div>

Responsive

To control the margin of an element at a specific breakpoint, add a {screen}: prefix to any existing margin utility. For example, adding the class md:my-8 to an element would apply the my-8 utility at medium screen sizes and above.

<div class="mt-8 md:my-8">
<!-- ... -->
</div>

For more information about Elements’ responsive design features, check out the Responsive Design documentation.