Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
CSS3 Media Queries template
/*
* Author: http://stuffandnonsense.co.uk/blog/about/hardboiled_css3_media_queries/
*/
/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
/* Styles */
}
/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px) {
/* Styles */
}
/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
/* Styles */
}
/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
/* Styles */
}
/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
/* Styles */
}
/* iPads (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
/* Styles */
}
/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1224px) {
/* Styles */
}
/* Large screens ----------- */
@media only screen
and (min-width : 1824px) {
/* Styles */
}
/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}

Very helpful, thank you!

mreis1 commented Apr 13, 2013

Completely useful. Thanks

Saved me ages!

oaajayi commented Aug 5, 2013

Thanks a lot! this is helpful

panhna commented Oct 15, 2013

thanks a lot !

awesome

Olliepop commented Jan 4, 2014

Saved a lot of time thank you!

ameikle commented Jan 5, 2014

Saved me a lot of time, Thank you!

Thanks!

jbess commented Jul 24, 2014

Nice thank

toklok commented Aug 13, 2014

This is really useful, thanks.

Johnn5 commented Jul 17, 2015

Thanks mate, saved me a head scratch

Thanks marcobarbosa

Detsl commented Sep 22, 2016

Thank you!

Good stuff

Thank you, using at SkyRooms.io :)

Thanks

bgkerion commented Feb 5, 2017

well done! Thank you

Arturdko commented Mar 1, 2017

Thanks for template. Will be used tomorrow.

You are a good human, this is very helpful! Thank you!

Awesome worrk

Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment