title: Bootstrap navbar empty on IE9
body: <p>I tried to use the bootstrap template to generate a navbar on my aspnet mvc application.</p>
  
  <p>Everything works fine on Firefox and Chrome, but on IE my menu is transparent :</p>
  
  <p><a href="https://imgur.com/0sbdHGX" rel="nofollow noreferrer"><img src="https://i.imgur.com/0sbdHGX.png" title="Hosted by imgur.com" /></a></p>
  
  <p>I checked, I have the <code>&lt;!DOCTYPE html&gt;</code> at the begining of my layout.
  I also tried <code>&lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;</code></p>
  
  <p>I tried to play with the F12 menu and compatibility mode, without success.</p>
  
  <p>Any other clue ?</p>
  
  <p>Thanks</p>
  
  <p>Edit: here is the generated code :</p>
  
  <pre><code>            &lt;!DOCTYPE html&gt;
  
              &lt;html lang="en"&gt;
              &lt;head&gt;
                  &lt;meta charset="utf-8" /&gt;
                  &lt;meta name="viewport" content="width=device-width, initial-scale=1.0" /&gt;
                  &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt; 
                  &lt;title&gt;Test &amp;bull; Home&lt;/title&gt;
  
                  &lt;link href="bootstrap.css" rel="stylesheet"/&gt;
                  &lt;link href="bootstrap-theme.css" rel="stylesheet"/&gt;
                  &lt;link href="toastr.css" rel="stylesheet"/&gt;
                  &lt;script src="jquery-2.0.3.js"&gt;&lt;/script&gt;
                  &lt;script src="jquery-ui-1.10.3.js"&gt;&lt;/script&gt;
                  &lt;script src="angular.js"&gt;&lt;/script&gt;
                  &lt;script src="angular-resource.js"&gt;&lt;/script&gt;
                  &lt;script src="bootstrap.js"&gt;&lt;/script&gt;
                  &lt;script src="toastr.js"&gt;&lt;/script&gt;
  
                  &lt;!--[if lt IE 9]&gt; HTML5Shiv
                  &lt;script src="//html5shiv.googlecode.com/svn/trunk/html5.js"&gt;&lt;/script&gt;
                  &lt;![endif]--&gt; 
  
              &lt;/head&gt;
  
              &lt;body style="padding: 40px;"&gt;
                  &lt;div class="container"&gt;
  
              &lt;nav class="navbar navbar-default" role="navigation"&gt;
                  &lt;ul class="nav navbar-nav"&gt;
                      &lt;a class="navbar-brand" href="/"&gt;Test&lt;/a&gt;
                          &lt;li&gt;&lt;a href="/"&gt;Home&lt;/a&gt;&lt;/li&gt;
                              &lt;li class="nav-divider"&gt;&lt;/li&gt; 
                          &lt;li class="dropdown"&gt;
                              &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown"&gt;Pages &lt;b class="caret"&gt;&lt;/b&gt;&lt;/a&gt;
                              &lt;ul class="dropdown-menu"&gt;
                                      &lt;li&gt;&lt;a href="/Page1/"&gt;Page1&lt;/a&gt;&lt;/li&gt;
                                      &lt;li&gt;&lt;a href="/Page2/"&gt;Page2&lt;/a&gt;&lt;/li&gt;
                                      &lt;li&gt;&lt;a href="/Page3/"&gt;Page3&lt;/a&gt;&lt;/li&gt;
                                      &lt;li&gt;&lt;a href="/Page4/"&gt;Page4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/nav&gt;
                  &lt;/div&gt;
              &lt;/body&gt;
  </code></pre>