title: Can media queries be used along with jquery mobile?
body: <p>I'm just reading up on how to develop sites with responsive layouts. I think I've grasped the idea and can now style content differently, depending on browser dimensions.</p>
  
  <p>However I've also looked into Jquery mobile and I like the UI that they use. </p>
  
  <p>My question is, is it possible to combine the two? ie. Could I have a web page that renders normally when viewed on a pc/mac, but when the browser width drops sub 320px (for example), could I switch over to using Jquery mobile?</p>
  
  <p>I thought this'd be possible by including the jquery mobile scripts in my page, along with the 'data role' attributes, but only including the jquery mobile stylesheet if the browser is a particular size, ie:</p>
  
  <pre><code>&lt;link rel="stylesheet" type="text/css" media="screen and (max-device-width: 320px)" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" /&gt;
  </code></pre>
  
  <p>Is this at all possible? I can't tell whether I'm trying to use Jquery mobile for something it's not designed to deal with? Should I just have an entirely separate site ie. <a href="http://m.mysite.com" rel="nofollow">http://m.mysite.com</a> that has standalone mobile content? Or is it possible to have an adaptive website?</p>
  
  <p>Thanks!</p>