Created
April 26, 2020 23:25
-
-
Save m-primo/c87b856e33f763ee2ee098fbaff34dea to your computer and use it in GitHub Desktop.
Standard CSS Media Query
This file contains 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
| /* Max */ | |
| @media (max-width: 319px) { /* X-Small Screen */ | |
| } | |
| @media (max-width: 479px) { /* Small Screen */ | |
| } | |
| @media (max-width: 767px) { /* Medium Screen */ | |
| } | |
| @media (max-width: 1023px) { /* Large Screen */ | |
| } | |
| @media (max-width: 1199px) { /* X-Large Screen */ | |
| } | |
| /* Min */ | |
| @media (min-width: 320px) { /* X-Small Screen */ | |
| } | |
| @media (min-width: 480px) { /* Small Screen */ | |
| } | |
| @media (min-width: 768px) { /* Medium 1 Screen */ | |
| } | |
| @media (min-width: 992px) { /* Medium 2 Screen */ | |
| } | |
| @media (min-width: 1024px) { /* Large Screen */ | |
| } | |
| @media (min-width: 1200px) { /* X-Large Screen */ | |
| } | |
| /* ------------------------------------ */ | |
| /* Most Common #1 */ | |
| @media (max-width: 767px) { | |
| } | |
| @media (max-width: 991px) { | |
| } | |
| @media (max-width: 1199px) { | |
| } | |
| /* Most Common #2 */ | |
| @media (min-width: 768px) { | |
| } | |
| @media (min-width: 992px) { | |
| } | |
| @media (min-width: 1200px) { | |
| } | |
| /* Most Common #3 */ | |
| @media (min-width: 768px) and (max-width: 991px) { | |
| } | |
| @media (min-width: 992px) and (max-width: 1199px) { | |
| } | |
| @media (min-width: 1200px) { | |
| } | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment