title: CSS Media Query for multiple resolutions
body: <p>I am looking at using CSS Media Query to support multiple tablets (Android/iPad). Below is the Media Query which I have;</p>
  
  <pre><code>&lt;link rel="stylesheet" media="only screen and (max-device-width:1024px)" href="css/tablet.css"&gt;
  &lt;link rel="stylesheet" media="only screen and (min-device-width:1024px)" href="css/desktop.css"&gt;
  </code></pre>
  
  <p>Now my assumption is most tablets are below 1024px width. Please correct me on this front. Any tabular comparision would be great. </p>
  
  <p>Also any other approaches besides device-width for media query would be fine.</p>
  
  <p>I am looking at a generic way of designing my pages which would work for both desktop/tablet browsers...present and future (and may be even mobile). I am using fluid design (or called responsive design) for the same (everything in %...width/height/padding/margin all in %)</p>