title: @import browser compatibility 2013
body: <p>I've been reading up about responsive design and am going to start implementing a new CSS set-up on my site. This has lead me to thinking about the best way to call all these different CSS files. I'll have a different CSS for different screen widths.</p>
  
  <p>I am debating two options:</p>
  
  <ol>
  <li><p>connecting to all the files from each web page with LINK tags. My only problem with this is the ongoing maintenance (and having to add all these links to start with); I know this isn't the end of the world but seems a little bit intensive on the maintenance side.</p></li>
  <li><p>the other way would to have just one LINK tag on each web page, pointing at a 'feeder' CSS. This 'feeder' CSS file would include all the links to my other CSS files using @imports. This would mean maintenance would be a breeze. I could add/re-order/delete the CSS files in just one place for the entire site. Great! </p></li>
  </ol>
  
  <p>However this leads on to compatibility of the @import function [or lack of it in older browsers]. </p>
  
  <p>I've looked around and the articles I've seen have been at least a couple of years old.</p>
  
  <p>So, to get to the nub: what percentage of browsers that are being used now [July 2013] support this and can I safely forget about the browsers that wont be able to interpret @import?</p>
  
  <p>If not, what can I do to keep maintenance of CSS files down to a minimum. (Something more elegant than "find and replace on current site").</p>