The magic of style sheets

At the heart of both responsive and progressive approaches to cross-device development is Cascaded Style Sheets (CSS). This is the industry standard for styling the presentation and positioning of web page elements. Bootstrap relies on CSS Media queries that allow developers to specify when certain CSS rules should be applied. They can be used to deliver a tailored style sheet to a specific device. There are many places where we can add these queries to our code. For example, they can be links in our HTML:

<link rel="stylesheet" type="text/css"
  media="screen and (max-device-width: 480px)"
  href="responsiveArcGIS1.css" />

The media parameter in the preceding code contains two components: A media type (screen) represents the actual query enclosed within parentheses containing a particular media feature (max-device-width) to inspect, that is followed by the target value (480px)

What we are doing here is asking the device...