<ul id="main-nav" class="pull-right"> -- ALL ITEMS GO HERE -- </ul>
<li> <a href="javascript:;"> <i class="icon-home"></i> <span>Home</span> </a> </li>
NOTE: Be sure to add the class .nav-icon to the top-level LI element and wrap your link text in a span tag so it's hidden.
<li class="nav-icon"> <a href="javscript:;"> <i class="icon-home"></i> <span>Home</span> </a> </li>
<li class="dropdown"> <a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown"> <span>span>Dropdown</span> <b class="caret"></b> </a> <ul class="dropdown-menu"> <li><a href="#">Dropdown 1</a></li> <li><a href="#">Dropdown 2</a></li> </ul> </li>
<li class="dropdown">
<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown">
Multi-Level Dropdown
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="javascript:;">Dropdown #1</a></li>
<li><a href="javascript:;">Dropdown #2</a></li>
<li class="dropdown-submenu">
<a tabindex="-1" href="#">Dropdown menu</a>
<ul class="dropdown-menu">
<li>
<a tabindex="-1" href="#">Second level link</a>
</li>
<li>
<a tabindex="-1" href="#">Second level link</a>
</li>
<li>
<a tabindex="-1" href="#">Second level link</a>
</li>
</ul>
</li>
</ul>
</li>