Advanced Search

Theme media queries

/ Published in: CSS
Save to your folder(s)
Our theme's range of media queries

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. /* VIEWPORTS AND MEDIA QUERIES
  2.  
  3. For usability purposes we're currently curbing the responsive layout at 1200 pixels. Theoretically
  4. we already support responsiveness for whatever resolution. These are currently commented out.
  5.  
  6. -@media only screen and ( min-width: 2880px ) 	{ body { font-size: 28.5px; } }
  7. -@media only screen and ( max-width: 2879px ) 	{ body { font-size: 22.5px; } }
  8. -@media only screen and ( max-width: 2159px ) 	{ body { font-size: 19.0px; } }
  9. -@media only screen and ( max-width: 1919px ) 	{ body { font-size: 17.5px; } }
  10. -@media only screen and ( max-width: 1679px ) 	{ body { font-size: 15.0px; } } */
  11.  
  12. /* curbing the responsiveness at max font-size > 12.5px */
  13. @media only screen and ( min-width: 1440px ) 	{ body { font-size: 12.5px; } }
  14.  
  15. /* setting body font-sizes for different viewports */
  16. @media only screen and ( max-width: 1439px ) 	{ body { font-size: 12.5px; } }
  17. @media only screen and ( max-width: 1199px ) 	{ body { font-size: 10.0px; } }
  18. @media only screen and ( max-width: 959px ) 	{ body { font-size: 7.5px; } }
  19. @media only screen and ( max-width: 719px )	{ body { font-size: 5.0px; } }
  20. @media only screen and ( max-width: 479px )	{ body { font-size: 3.0px; } }
  21. @media only screen and ( max-width: 319px )	{ body { font-size: 2.5px; } }

URL: http://nexusthemes.com/?p=812&preview=true#

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.