title: Only apply CSS if not Internet Explorer
body: <p>CSS in this media query is only used when Internet Explorer is detected (simplifying the standard implementation for brevity):</p>
  
  <pre><code>@media screen and (-ms-high-contrast: none) {
      body { background-color: purple; }
  }
  </code></pre>
  
  <p>The way I understand how this works is that <code>(-ms-high-contrast: none)</code> returns false in non-IE browsers as they dont recoginse it.</p>
  
  <p>I want the CSS to be used only if NOT using Internet Explorer. I tried various things including this (IE11 correctly doesnt use the CSS but unfortunately neither do Chrome, Edge, or FF) (I believe the <code>not</code> operator applies round the whole query)...</p>
  
  <pre><code>@media not screen and (-ms-high-contrast: none) {
      body { background-color: purple; }
  }
  </code></pre>
  
  <p>More details in case it helps answer my question....
  My site has extra CSS that kicks in below a certain window width (ie responsive). However IE11 can't cope with some of the newer css used for responsive layout, so as a fallback, I want IE11 to just layout in fixed desktop mode. So I need a way for IE11 to ignore the extra responsive CSS.</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>Note, this is about excluding JUST Internet Explorer, not older browsers in general. In particular for older mobile browsers (especially as you cant update the stock browser on old Android). In may case I am using css <code>grid</code> to auto-place dynamically created cells. As the window shrinks, the number of columns reduce. In old mobile browsers that don't support grid, you just get a vertical list of cells - which looks fine (as they usually have quite narrow displays), however for older desktop browsers (IE11 is still in use on Windows 7), I dont want this - I want to have a fixed 4 column grid.</p>