Skip to content

Instantly share code, notes, and snippets.

@thierryc

thierryc/CSS Mobile First CSS Media Queries in em

Created July 2, 2018 21:37
Show Gist options
  • Save thierryc/995db945ceb6a60b0a7536c63a0e37d5 to your computer and use it in GitHub Desktop.
Save thierryc/995db945ceb6a60b0a7536c63a0e37d5 to your computer and use it in GitHub Desktop.
Download ZIP
CSS Mobile First CSS Media Queries in em
Raw
CSS Mobile First CSS Media Queries in em
/* smartphones, iPhone, portrait 480x320 phones(min-width:320px) */
@media screen and (min-width: 20em) {}
/* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. (min-width:481px) */
@media screen and (min-width: 30.06em) {}
/* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones (min-width:641px) */
@media screen and (min-width: 40.06em) {}
/* tablet, landscape iPad, lo-res laptops ands desktops (min-width:961px) */
@media screen and (min-width: 60.06em) {}
/* big landscape tablets, laptops, and desktops (min-width:1025px) */
@media screen and (min-width: 64.06em) {}
/* hi-res laptops and desktops (min-width:1281px) */
@media screen and (min-width: 80.06em) {}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment