title: Media queries: avoiding unnecessary downloading of CSS/images
body: <p>I've been reading about the 'only' keyword but can't find a definitive answer to this.</p>
  
  <p>I'm interested to know if there's a way, using only CSS (not Javascript), to avoid all older browsers that don't understand media queries (e.g. old mobiles) and modern browsers that do understand media queries but that return false for them (e.g. smartphones looking at min-device-width of 740px) reading linked CSS files and downloading associated large background images. I'm concerned about loading times and bandwidth.</p>
  
  <p>If this isn't possible, I'm thinking I'll use <a href="http://www.handsetdetection.com/features/mobile-browser-detection" rel="nofollow">http://www.handsetdetection.com/features/mobile-browser-detection</a> or <a href="http://www.hand-interactive.com/resources/detect-mobile-php.htm" rel="nofollow">http://www.hand-interactive.com/resources/detect-mobile-php.htm</a> (server side solutions) to conditionally serve "full fat" stylesheets that contain perhaps larger images only to device widths of 740px and above, for example.</p>