title: How to add own icons in bootstrap navbar
body: <p>Working on a project, where i started on the navbar. The thing i am wondering if its possible to add my own icons right next to each of the menu bars ? For example this icons: <a href="https://www.dropbox.com/sh/0be3c7ub4245kd6/zNMrvFi6Wq" rel="noreferrer">https://www.dropbox.com/sh/0be3c7ub4245kd6/zNMrvFi6Wq</a></p>
  
  <p>Like this:</p>
  
  <p><img src="https://i.stack.imgur.com/VBtIL.png" alt="enter image description here"></p>
  
  <ul>
  <li><a href="http://jsfiddle.net/UgPNR/5/" rel="noreferrer">DEMO</a></li>
  </ul>
  
  <p>Code:</p>
  
  <pre><code>&lt;!-- Fixed navbar --&gt;
      &lt;div class="navbar navbar-default navbar-fixed-top" role="navigation"&gt;
        &lt;div class="container"&gt;
          &lt;div class="navbar-header"&gt;
            &lt;button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-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;Project name&lt;/a&gt;
          &lt;/div&gt;
          &lt;div class="navbar-collapse collapse"&gt;
            &lt;ul class="nav navbar-nav"&gt;
              &lt;li class="active"&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#about"&gt;About&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#contact"&gt;Contact&lt;/a&gt;&lt;/li&gt;
  
            &lt;/ul&gt;
  
          &lt;/div&gt;&lt;!--/.nav-collapse --&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div class="container"&gt;
  
        &lt;!-- Main component for a primary marketing message or call to action --&gt;
        &lt;div class="jumbotron"&gt;
          &lt;h1&gt;Navbar example&lt;/h1&gt;
          &lt;p&gt;This example is a quick exercise to illustrate how the default, static and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.&lt;/p&gt;
          &lt;p&gt;To see the difference between static and fixed top navbars, just scroll.&lt;/p&gt;
          &lt;p&gt;
            &lt;a class="btn btn-lg btn-primary" href="../../components/#navbar" role="button"&gt;View navbar docs &amp;raquo;&lt;/a&gt;
          &lt;/p&gt;
        &lt;/div&gt;
  
      &lt;/div&gt; &lt;!-- /container --&gt;
  </code></pre>