CSS Snippet to Target Phones, Tablets, and Desktops Separately

@media (min-width:20em)  { /* iPhones, Androids portrait 480x320 phones */ }
@media (min-width:30em)  { /* e-readers (Nook/Kindle), mini tablets 600x600 */ }
@media (min-width:40em)  { /* medium tablets, iPads, and e-readers, landscape 800x480 */ }
@media (min-width:60em)  { /* standard tablets, landscape iPads, lo-resolution laptops ands desktops */ }
@media (min-width:64em) { /* larger tablets, standard laptops, and 24" monitors */ }
@media (min-width:80em) { /* High resolution laptops and desktops */ }

Leave a Reply

Your email address will not be published. Required fields are marked *