title: IE11 - Ignoring all @media queries - Bootstrap
body: <p>I am using bootstrap to build a very simple 3 columns row. Using Chrome everything shows as expected (3 columns in a row). When I view the same page in IE11 I get 3 rows (it's stacking the 3 columns on top of each other. </p>
  
  <pre><code>&lt;div class="row"&gt;
      &lt;!--P3U wekly bar chart--&gt;
      &lt;div class="col-sm-4"&gt;                      
          Test1
      &lt;/div&gt;
  
      &lt;div class="col-sm-4"&gt;                      
          Test2
      &lt;/div&gt;
  
      &lt;div class="col-sm-4"&gt;                      
          Test3
      &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>Comparing both in dev mode, I noticed that Chrome has a few @media queries to handle the width of the col-sm-4 classes for example:</p>
  
  <pre><code>@media (min-width: 768px)
  .col-sm-4 {
    width: 33.33333333%;
  }
  @media (min-width: 768px)
  .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9 {
    float: left;
  }
  .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
  }
  </code></pre>
  
  <p>None of this CSS shows up in IE11, seems like its ignoring this portion. For the heck of it I manually added these CSS codes to the IE11 and everything started to get into place correctly. Now I assume that there is a special method for certain CSS code to work in IE11 but looking all over the web, couldn't find some clear answer. </p>
  
  <p>Added to my page the Response.js scripts that are used for IE8 pages to see if that would make a difference but it didnt.</p>
  
  <p>Would anyone have any idea what im missing here?</p>