iOS Media Queries Boilerplate

Media Queries are now becoming quite common practice in web design. They allow you to change the CSS of the different elements on your web page depending on the size of the screen the visitor currently can see. Below is a media query boilerplate you can use to change the design of your depending on if the user is using an iPad or and iPhone. This snippet even allows you to change the design if the device is landscape or portrait.