CSS Width Settings for Mobile

StackOverflow: How to Target Desktop, Tablet and Mobile

If you’re like me you already spend more time in CSS stylesheets than you’d like Yet we need to accommodate mobile and other platforms, that is, make whatever we build pretty on any device.

This StackOverflow should help you knock out your current CSS mobile entanglement and get back to coding. Here’s an excerpt showing different min-widths by platform as recommended by Bootstrap.


/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {}