title: Automatically change css when resolution is changed
body: <p>What I've done is this</p>
  
  <pre><code> &lt;link type="text/css" rel="stylesheet" media="screen and (max-device-width: 1300px)" href="css/style.css"&gt;
  &lt;link type="text/css" rel="stylesheet" media="screen and (min-device-width: 1301px)" href="css/big.css"&gt;
  </code></pre>
  
  <p>The most important change dependent on the resolution is the following. The big.css uses this </p>
  
  <pre><code>.content
  {
      width:20%;
  }
  </code></pre>
  
  <p>and the style.css uses 50% for the width.</p>
  
  <p>My problem now is, that I have two monitors. The right one responds to the style.css and the left one to the big.css
  When I now open the site on my right monitor it uses the style.css. The problem is, that when I grab the window and drag it to my left monitor the .css doesn't change UNLESS I reload the page. But I want it automatically to be changed when the window is dragged to a bigger screen.
  Maybe this is possible with JavaScript?</p>