title: Bootstrap Affix not working with IE, Chrome or MS Edge
body: <p>I have been developing in Firefox and only just noticed after a few days of creating a new site that bootstrap affix does not work in Chrome/IE/Edge? I am using the latest version of Bootstrap and the latest versions of Firefox and Chrome. Not sure what version of IE I am running.</p>
  
  <p>Tried a few work arounds but nothing seems to help. </p>
  
  <p>CSS:</p>
  
  <pre><code>.affix {
      top: 0;
      width: 100%;
  }
  .affix + .container-fluid {
      padding-top: 0px;
  }
  .affix-bottom {
      position: absolute;
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;body data-spy="scroll" data-target="#myScrollspy" data-offset="20"&gt;
      &lt;div id="scroll"&gt; ....
      &lt;/div&gt;
      &lt;!--  Navbar --&gt;
      &lt;div id="nav"&gt;
          &lt;div class="navbar navbar-inverse navbar-static-top" style="background: #26292E none repeat scroll 0% 0%;border-color: #DE5E60;"&gt;
              &lt;div class="container"&gt;
                  &lt;!-- .btn-navbar is used as the toggle for collapsed navbar content --&gt;
                  &lt;a href="#" class="navbar-brand"&gt;Brand&lt;/a&gt;
                  &lt;a class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"&gt;
                      &lt;span class="glyphicon glyphicon-bar"&gt;&lt;/span&gt;
                      &lt;span class="glyphicon glyphicon-bar"&gt;&lt;/span&gt;
                      &lt;span class="glyphicon glyphicon-bar"&gt;&lt;/span&gt;
                  &lt;/a&gt;
                  &lt;div class="navbar-collapse collapse"&gt;
                      &lt;ul class="nav navbar-nav"&gt;
                          &lt;li&gt;
                              &lt;a href="#"&gt;Link&lt;/a&gt;
                          &lt;/li&gt;
                          &lt;li&gt;
                              &lt;a href="#"&gt;Link&lt;/a&gt;
                          &lt;/li&gt;
                      &lt;/ul&gt;
                      &lt;ul class="nav pull-right navbar-nav"&gt;
                          &lt;li class="dropdown"&gt;
                              &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"&gt;
                                  &lt;i class="glyphicon glyphicon-user"&gt;&lt;/i&gt;
                                  Sign In
                              &lt;/a&gt;
                              &lt;div class="dropdown-menu form-login stop-propagation" role="menu"&gt;
                                  &lt;div class="form-group"&gt;
                                      &lt;label for="exampleInputEmail1"&gt;
                                          &lt;i class="glyphicon glyphicon-envelope"&gt;&lt;/i&gt;
                                          Email address
                                      &lt;/label&gt;
                                      &lt;input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email" /&gt;
                                  &lt;/div&gt;
                                  &lt;div class="form-group"&gt;
                                      &lt;label for="exampleInputPassword1"&gt;
                                          &lt;i class="glyphicon glyphicon-lock"&gt;&lt;/i&gt;
                                          Password
                                      &lt;/label&gt;
                                      &lt;input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password" /&gt;
                                  &lt;/div&gt;
                                  &lt;!--&lt;button type="submit" class="btn btn-success btn-block"&gt;&lt;i class="glyphicon glyphicon-ok"&gt;&lt;/i&gt; Submit&lt;/button&gt;--&gt;
                                  &lt;a id="contact-submit" class="submit" href="#"&gt;Submit&lt;/a&gt;
                              &lt;/div&gt;
                          &lt;/li&gt;
                      &lt;/ul&gt;
                      &lt;ul class="nav pull-right navbar-nav"&gt;
                          &lt;li&gt;
                              &lt;form class="navbar-form"&gt;
                                  &lt;input class="form-control" placeholder="Search" type="text" /&gt;
                                  &lt;button type="submit" class="btn btn-default"&gt;
                                      &lt;i class="glyphicon glyphicon-search"&gt;&lt;/i&gt;
                                  &lt;/button&gt;
                              &lt;/form&gt;
                          &lt;/li&gt;
                          &lt;li&gt;
                              &lt;a href="#"&gt;
                                  &lt;span class="badge"&gt;2&lt;/span&gt;
                              &lt;/a&gt;
                          &lt;/li&gt;
                      &lt;/ul&gt;
  
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;!-- /.navbar --&gt;
      &lt;/div&gt;
      &lt;!-- End Navbar --&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>$('#nav').affix({
      offset: {
          top: $('#scroll').height()
      }
  });
  </code></pre>