title: Bootstrap 3 Navbar toggle - collapses but button does not appear
body: <p>I don't know what I'm doing wrong here but I expect it's something woefully stupid.</p>
  
  <p>I'm using Bootstrap 3 in Umbraco 6.0.5 and I cannot get the toggle to work on resize down - below 770px width the nav collapses but there's no button to toggle it with, or rather something is there, as seen in code and Firebug, but not visible, in Chrome and Firefox (haven't tried IE).</p>
  
  <p>There's a <a href="http://jsfiddle.net/D2eCY/" rel="noreferrer"><strong>fiddle</strong></a> and the code below. I'm using <a href="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" rel="noreferrer">http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js</a>, <a href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js" rel="noreferrer">http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js</a> and <a href="http://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="noreferrer">http://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css</a> in the fiddle.</p>
  
  <pre><code>&lt;nav class="navbar"&gt;
    &lt;div class="container-fluid"&gt;
      &lt;div class="navbar-header"&gt;
  
        &lt;button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".nav-collapse"&gt;
          &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
          &lt;span class="icon-bar"&gt;&lt;/span&gt;
          &lt;span class="icon-bar"&gt;&lt;/span&gt;
          &lt;span class="icon-bar"&gt;&lt;/span&gt;
        &lt;/button&gt;
        &lt;a class="navbar-brand" href"#"&gt;reech&lt;/a&gt;  
      &lt;/div&gt;
  
      &lt;div class="collapse navbar-collapse" id="nav-collapse"&gt;
        &lt;ul class="nav navbar-nav"&gt;
          &lt;li&gt;&lt;a href="/" class="selected"&gt;Home&lt;/a&gt;&lt;/li&gt;
          &lt;li class=" dropdown"&gt;
            &lt;a href="/what-is-reech.aspx" class=" dropdown-toggle" data-hover="dropdown" rel=""&gt;What is reech? &lt;b class="caret"&gt;&lt;/b&gt;&lt;/a&gt;
            &lt;ul class="dropdown-menu"&gt;
              &lt;li&gt;&lt;a href="/what-is-reech/about-this-site.aspx" rel=""&gt;About this site&lt;/a&gt;&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/li&gt;
          &lt;li class=" dropdown"&gt;
          &lt;/li&gt;
          &lt;li&gt;&lt;a href="/key-reech-projects.aspx" class="" rel=""&gt;Key reech projects&lt;/a&gt;&lt;/li&gt; 
          &lt;li class=" dropdown"&gt;
          &lt;/li&gt;
          &lt;li&gt;&lt;a href="/technologies.aspx" class="" rel=""&gt;Technologies&lt;/a&gt;&lt;/li&gt; 
          &lt;li class=" dropdown"&gt;
          &lt;/li&gt;
          &lt;li&gt;&lt;a href="/complementary-activities.aspx" class="" rel=""&gt;Complementary Activities&lt;/a&gt;&lt;/li&gt; 
          &lt;li class=" dropdown"&gt;
            &lt;a href="/news.aspx" class=" dropdown-toggle" data-hover="dropdown" rel=""&gt;News &lt;b class="caret"&gt;&lt;/b&gt;&lt;/a&gt;
            &lt;ul class="dropdown-menu"&gt;
              &lt;li&gt;&lt;a href="/news/merseyside-collective-switching-scheme-launched.aspx" rel=""&gt;Merseyside collective switching scheme launched&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/news/reech-scoops-top-award.aspx" rel=""&gt;reech scoops top award&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/news/reech-award-nomination.aspx" rel=""&gt;reech award nomination&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/news/green-deal-and-energy-company-obligation-(eco)-september-2013-statistics.aspx" rel=""&gt;Green Deal and Energy Company Obligation (ECO) September 2013 Statistics&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/news/energy-switching-scheme.aspx" rel=""&gt;Energy Switching Scheme&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/news/project-reeches-new-milestone.aspx" rel=""&gt;Project &amp;#39;reeches&amp;#39; new milestone&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/news/firms-sign-up-for-new-opportunities.aspx" rel=""&gt;Firms sign up for new opportunities&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/news/14-new-jobs-created-for-merseyside-residents.aspx" rel=""&gt;14 new jobs created for Merseyside residents&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/news/reeching-out-to-low-carbon-and-green-energy-sector.aspx" rel=""&gt;&amp;#39;reeching&amp;#39; out to Low Carbon and Green Energy Sector&lt;/a&gt;&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/li&gt;
          &lt;li class=" dropdown"&gt;
          &lt;/li&gt;
          &lt;li&gt;&lt;a href="/reech-into-business.aspx" class="" rel=""&gt;reech into business&lt;/a&gt;&lt;/li&gt; 
          &lt;li class=" dropdown"&gt;
            &lt;a href="/reech-partners.aspx" class=" dropdown-toggle" data-hover="dropdown" rel=""&gt;reech partners &lt;b class="caret"&gt;&lt;/b&gt;&lt;/a&gt;
            &lt;ul class="dropdown-menu"&gt;
              &lt;li&gt;&lt;a href="/reech-partners/reech-steering-group.aspx" rel=""&gt;reech Steering Group&lt;/a&gt;&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/li&gt;
  
        &lt;/ul&gt;
      &lt;/div&gt;&lt;!--close navbar-collapse--&gt;
    &lt;/div&gt;&lt;!--close container--&gt;
  &lt;/nav&gt;&lt;!--Close nav--&gt;
  </code></pre>
  
  <p>Update - so, I tried altering the data-target (and have altered the <a href="http://jsfiddle.net/kelpie/D2eCY/16/" rel="noreferrer"><strong>fiddle</strong></a>) to #main-nav and the id to main-nav, no joy.
  The I tried putting a dash character in the button > span element, and it works. That is, the dashes display, and I can toggle the menu. But where are the icon bars?</p>
  
  <pre><code>  &lt;button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#main-nav"&gt;
      &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
      &lt;span class="icon-bar"&gt;-&lt;/span&gt;
      &lt;span class="icon-bar"&gt;-&lt;/span&gt;
      &lt;span class="icon-bar"&gt;-&lt;/span&gt;
    &lt;/button&gt;
  </code></pre>