Created
July 7, 2025 09:11
-
-
Save firecall/7277ffb00dd0477a223261fef5de62cb to your computer and use it in GitHub Desktop.
Bootstrap 5-style Responsive Margin Utility Classes
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* Generated by Copilot */ | |
| /* Bootstrap 5-style Responsive Margin Utility Classes */ | |
| .m-0 { margin: 0 !important; } | |
| .m-1 { margin: 0.25rem !important; } | |
| .m-2 { margin: 0.5rem !important; } | |
| .m-3 { margin: 1rem !important; } | |
| .m-4 { margin: 1.5rem !important; } | |
| .m-5 { margin: 3rem !important; } | |
| .mt-0 { margin-top: 0 !important; } | |
| .mt-1 { margin-top: 0.25rem !important; } | |
| .mt-2 { margin-top: 0.5rem !important; } | |
| .mt-3 { margin-top: 1rem !important; } | |
| .mt-4 { margin-top: 1.5rem !important; } | |
| .mt-5 { margin-top: 3rem !important; } | |
| .mb-0 { margin-bottom: 0 !important; } | |
| .mb-1 { margin-bottom: 0.25rem !important; } | |
| .mb-2 { margin-bottom: 0.5rem !important; } | |
| .mb-3 { margin-bottom: 1rem !important; } | |
| .mb-4 { margin-bottom: 1.5rem !important; } | |
| .mb-5 { margin-bottom: 3rem !important; } | |
| .ms-0 { margin-left: 0 !important; } | |
| .ms-1 { margin-left: 0.25rem !important; } | |
| .ms-2 { margin-left: 0.5rem !important; } | |
| .ms-3 { margin-left: 1rem !important; } | |
| .ms-4 { margin-left: 1.5rem !important; } | |
| .ms-5 { margin-left: 3rem !important; } | |
| .me-0 { margin-right: 0 !important; } | |
| .me-1 { margin-right: 0.25rem !important; } | |
| .me-2 { margin-right: 0.5rem !important; } | |
| .me-3 { margin-right: 1rem !important; } | |
| .me-4 { margin-right: 1.5rem !important; } | |
| .me-5 { margin-right: 3rem !important; } | |
| /* Responsive (sm, md, lg, xl, xxl) */ | |
| @media (min-width: 576px) { | |
| .m-sm-0 { margin: 0 !important; } | |
| .m-sm-1 { margin: 0.25rem !important; } | |
| .m-sm-2 { margin: 0.5rem !important; } | |
| .m-sm-3 { margin: 1rem !important; } | |
| .m-sm-4 { margin: 1.5rem !important; } | |
| .m-sm-5 { margin: 3rem !important; } | |
| .mt-sm-0 { margin-top: 0 !important; } | |
| .mt-sm-1 { margin-top: 0.25rem !important; } | |
| .mt-sm-2 { margin-top: 0.5rem !important; } | |
| .mt-sm-3 { margin-top: 1rem !important; } | |
| .mt-sm-4 { margin-top: 1.5rem !important; } | |
| .mt-sm-5 { margin-top: 3rem !important; } | |
| .mb-sm-0 { margin-bottom: 0 !important; } | |
| .mb-sm-1 { margin-bottom: 0.25rem !important; } | |
| .mb-sm-2 { margin-bottom: 0.5rem !important; } | |
| .mb-sm-3 { margin-bottom: 1rem !important; } | |
| .mb-sm-4 { margin-bottom: 1.5rem !important; } | |
| .mb-sm-5 { margin-bottom: 3rem !important; } | |
| .ms-sm-0 { margin-left: 0 !important; } | |
| .ms-sm-1 { margin-left: 0.25rem !important; } | |
| .ms-sm-2 { margin-left: 0.5rem !important; } | |
| .ms-sm-3 { margin-left: 1rem !important; } | |
| .ms-sm-4 { margin-left: 1.5rem !important; } | |
| .ms-sm-5 { margin-left: 3rem !important; } | |
| .me-sm-0 { margin-right: 0 !important; } | |
| .me-sm-1 { margin-right: 0.25rem !important; } | |
| .me-sm-2 { margin-right: 0.5rem !important; } | |
| .me-sm-3 { margin-right: 1rem !important; } | |
| .me-sm-4 { margin-right: 1.5rem !important; } | |
| .me-sm-5 { margin-right: 3rem !important; } | |
| } | |
| @media (min-width: 768px) { | |
| .m-md-0 { margin: 0 !important; } | |
| .m-md-1 { margin: 0.25rem !important; } | |
| .m-md-2 { margin: 0.5rem !important; } | |
| .m-md-3 { margin: 1rem !important; } | |
| .m-md-4 { margin: 1.5rem !important; } | |
| .m-md-5 { margin: 3rem !important; } | |
| .mt-md-0 { margin-top: 0 !important; } | |
| .mt-md-1 { margin-top: 0.25rem !important; } | |
| .mt-md-2 { margin-top: 0.5rem !important; } | |
| .mt-md-3 { margin-top: 1rem !important; } | |
| .mt-md-4 { margin-top: 1.5rem !important; } | |
| .mt-md-5 { margin-top: 3rem !important; } | |
| .mb-md-0 { margin-bottom: 0 !important; } | |
| .mb-md-1 { margin-bottom: 0.25rem !important; } | |
| .mb-md-2 { margin-bottom: 0.5rem !important; } | |
| .mb-md-3 { margin-bottom: 1rem !important; } | |
| .mb-md-4 { margin-bottom: 1.5rem !important; } | |
| .mb-md-5 { margin-bottom: 3rem !important; } | |
| .ms-md-0 { margin-left: 0 !important; } | |
| .ms-md-1 { margin-left: 0.25rem !important; } | |
| .ms-md-2 { margin-left: 0.5rem !important; } | |
| .ms-md-3 { margin-left: 1rem !important; } | |
| .ms-md-4 { margin-left: 1.5rem !important; } | |
| .ms-md-5 { margin-left: 3rem !important; } | |
| .me-md-0 { margin-right: 0 !important; } | |
| .me-md-1 { margin-right: 0.25rem !important; } | |
| .me-md-2 { margin-right: 0.5rem !important; } | |
| .me-md-3 { margin-right: 1rem !important; } | |
| .me-md-4 { margin-right: 1.5rem !important; } | |
| .me-md-5 { margin-right: 3rem !important; } | |
| } | |
| @media (min-width: 992px) { | |
| .m-lg-0 { margin: 0 !important; } | |
| .m-lg-1 { margin: 0.25rem !important; } | |
| .m-lg-2 { margin: 0.5rem !important; } | |
| .m-lg-3 { margin: 1rem !important; } | |
| .m-lg-4 { margin: 1.5rem !important; } | |
| .m-lg-5 { margin: 3rem !important; } | |
| .mt-lg-0 { margin-top: 0 !important; } | |
| .mt-lg-1 { margin-top: 0.25rem !important; } | |
| .mt-lg-2 { margin-top: 0.5rem !important; } | |
| .mt-lg-3 { margin-top: 1rem !important; } | |
| .mt-lg-4 { margin-top: 1.5rem !important; } | |
| .mt-lg-5 { margin-top: 3rem !important; } | |
| .mb-lg-0 { margin-bottom: 0 !important; } | |
| .mb-lg-1 { margin-bottom: 0.25rem !important; } | |
| .mb-lg-2 { margin-bottom: 0.5rem !important; } | |
| .mb-lg-3 { margin-bottom: 1rem !important; } | |
| .mb-lg-4 { margin-bottom: 1.5rem !important; } | |
| .mb-lg-5 { margin-bottom: 3rem !important; } | |
| .ms-lg-0 { margin-left: 0 !important; } | |
| .ms-lg-1 { margin-left: 0.25rem !important; } | |
| .ms-lg-2 { margin-left: 0.5rem !important; } | |
| .ms-lg-3 { margin-left: 1rem !important; } | |
| .ms-lg-4 { margin-left: 1.5rem !important; } | |
| .ms-lg-5 { margin-left: 3rem !important; } | |
| .me-lg-0 { margin-right: 0 !important; } | |
| .me-lg-1 { margin-right: 0.25rem !important; } | |
| .me-lg-2 { margin-right: 0.5rem !important; } | |
| .me-lg-3 { margin-right: 1rem !important; } | |
| .me-lg-4 { margin-right: 1.5rem !important; } | |
| .me-lg-5 { margin-right: 3rem !important; } | |
| } | |
| @media (min-width: 1200px) { | |
| .m-xl-0 { margin: 0 !important; } | |
| .m-xl-1 { margin: 0.25rem !important; } | |
| .m-xl-2 { margin: 0.5rem !important; } | |
| .m-xl-3 { margin: 1rem !important; } | |
| .m-xl-4 { margin: 1.5rem !important; } | |
| .m-xl-5 { margin: 3rem !important; } | |
| .mt-xl-0 { margin-top: 0 !important; } | |
| .mt-xl-1 { margin-top: 0.25rem !important; } | |
| .mt-xl-2 { margin-top: 0.5rem !important; } | |
| .mt-xl-3 { margin-top: 1rem !important; } | |
| .mt-xl-4 { margin-top: 1.5rem !important; } | |
| .mt-xl-5 { margin-top: 3rem !important; } | |
| .mb-xl-0 { margin-bottom: 0 !important; } | |
| .mb-xl-1 { margin-bottom: 0.25rem !important; } | |
| .mb-xl-2 { margin-bottom: 0.5rem !important; } | |
| .mb-xl-3 { margin-bottom: 1rem !important; } | |
| .mb-xl-4 { margin-bottom: 1.5rem !important; } | |
| .mb-xl-5 { margin-bottom: 3rem !important; } | |
| .ms-xl-0 { margin-left: 0 !important; } | |
| .ms-xl-1 { margin-left: 0.25rem !important; } | |
| .ms-xl-2 { margin-left: 0.5rem !important; } | |
| .ms-xl-3 { margin-left: 1rem !important; } | |
| .ms-xl-4 { margin-left: 1.5rem !important; } | |
| .ms-xl-5 { margin-left: 3rem !important; } | |
| .me-xl-0 { margin-right: 0 !important; } | |
| .me-xl-1 { margin-right: 0.25rem !important; } | |
| .me-xl-2 { margin-right: 0.5rem !important; } | |
| .me-xl-3 { margin-right: 1rem !important; } | |
| .me-xl-4 { margin-right: 1.5rem !important; } | |
| .me-xl-5 { margin-right: 3rem !important; } | |
| } | |
| @media (min-width: 1400px) { | |
| .m-xxl-0 { margin: 0 !important; } | |
| .m-xxl-1 { margin: 0.25rem !important; } | |
| .m-xxl-2 { margin: 0.5rem !important; } | |
| .m-xxl-3 { margin: 1rem !important; } | |
| .m-xxl-4 { margin: 1.5rem !important; } | |
| .m-xxl-5 { margin: 3rem !important; } | |
| .mt-xxl-0 { margin-top: 0 !important; } | |
| .mt-xxl-1 { margin-top: 0.25rem !important; } | |
| .mt-xxl-2 { margin-top: 0.5rem !important; } | |
| .mt-xxl-3 { margin-top: 1rem !important; } | |
| .mt-xxl-4 { margin-top: 1.5rem !important; } | |
| .mt-xxl-5 { margin-top: 3rem !important; } | |
| .mb-xxl-0 { margin-bottom: 0 !important; } | |
| .mb-xxl-1 { margin-bottom: 0.25rem !important; } | |
| .mb-xxl-2 { margin-bottom: 0.5rem !important; } | |
| .mb-xxl-3 { margin-bottom: 1rem !important; } | |
| .mb-xxl-4 { margin-bottom: 1.5rem !important; } | |
| .mb-xxl-5 { margin-bottom: 3rem !important; } | |
| .ms-xxl-0 { margin-left: 0 !important; } | |
| .ms-xxl-1 { margin-left: 0.25rem !important; } | |
| .ms-xxl-2 { margin-left: 0.5rem !important; } | |
| .ms-xxl-3 { margin-left: 1rem !important; } | |
| .ms-xxl-4 { margin-left: 1.5rem !important; } | |
| .ms-xxl-5 { margin-left: 3rem !important; } | |
| .me-xxl-0 { margin-right: 0 !important; } | |
| .me-xxl-1 { margin-right: 0.25rem !important; } | |
| .me-xxl-2 { margin-right: 0.5rem !important; } | |
| .me-xxl-3 { margin-right: 1rem !important; } | |
| .me-xxl-4 { margin-right: 1.5rem !important; } | |
| .me-xxl-5 { margin-right: 3rem !important; } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment