Media Queries For Common Screen Sizes.


/ Published in: CSS
Save to your folder(s)

CSS media queries for common screen sizes which are ignored in older browsers.


Copy this code and paste it in your HTML
  1. /* SCREEN RULES */
  2. /*=============================================================================*/
  3.  
  4. /* MOBILE DEVICES */
  5. @media only screen and (min-device-width: 320px) { /* 320 */
  6. }
  7.  
  8. @media only screen and (min-device-width: 480px) { /* 480px | iPhone: Portrait */
  9. }
  10.  
  11.  
  12. @media only screen and (min-device-width: 640px) { /* 640px */
  13. }
  14.  
  15. @media only screen and (min-device-width: 768px) { /* 768px | iPad: Portrait */
  16. }
  17.  
  18. /* LAPTOPS & DESKTOPS */
  19. @media only screen and (min-device-width: 800px) { /* 800px */
  20. }
  21.  
  22. @media only screen and (min-device-width: 1024px) { /* 1024px */
  23. }
  24.  
  25. @media only screen and (min-device-width: 1280px) { /* 1280px */
  26. }
  27.  
  28. @media only screen and (min-device-width: 1366px) { /* 1366px */
  29. }

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.