title: How do I use ui-sref-active with bootstrap navbar-brand?
body: <p>In this sample: <a href="https://stackoverflow.com/questions/25693320/angularjs-navigation-menu-with-ui-bootstrap-tabs-and-ui-router/29937880#29937880">Angularjs navigation menu with UI-Bootstrap tabs and UI-Router</a></p>
  
  <p>The following works great for the list items on the navbar and highlights them as I click:</p>
  
  <pre><code> &lt;ul&gt;
     &lt;li ui-sref-active="active" class="item"&gt;
       &lt;a href ui-sref="route1"&gt;route1&lt;/a&gt;
     &lt;/li&gt;
   &lt;/ul&gt;
  </code></pre>
  
  <p>But when I use the standard boostrap navbar-brand  I can't make this work:</p>
  
  <pre><code> &lt;nav class="navbar navbar-fixed-top"&gt;
      &lt;div class="container-fluid"&gt;
          &lt;div ui-sref-active="active" class="navbar-header"&gt;
              &lt;a href class="navbar-brand" ui-sref="state1"&gt;State1&lt;/a&gt;
          &lt;/div&gt;
          &lt;ul class="nav navbar-nav"&gt;
              &lt;li ui-sref-active="active" class="item"&gt;
                  &lt;a href ui-sref="state2"&gt;State2&lt;/a&gt;
              &lt;/li&gt;
              &lt;li ui-sref-active="active" class="item"&gt;
                  &lt;a href ui-sref="state3"&gt;State3&lt;/a&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
          &lt;p class="nav navbar-text navbar-right"&gt;Hello, @User.Identity.Name!&lt;/p&gt;
      &lt;/div&gt;
   &lt;/nav&gt;
  </code></pre>
  
  <p>Have tried just about everything, but can't find this specific combination of technologies and the navbar-brand.  Any help would be appreciated.</p>