Can't "pull-right" icon glyph in bootstrap
css, html, twitter-bootstrap
Solution
The solution from cetver works well for me.
For the record though, here's another way to get the same results: http://www.bootply.com/70536
HTML
<a href="#"><i class="icon-arrow-right"></i> 2-level Dropdown</a>
CSS
.icon-arrow-right {
float: right;
margin-top: 2px;
margin-right: -6px;
}
Problem
I want to pull right icon glyph in drop down menu like as below ``` <div class="navbar"> <div class="navbar-inner"> <ul class="nav"> <li class="dropdown"> <a data-toggle="dropdown" class="dropdown-toggle" href="#">Dropdown <b class="caret"></b></a> <ul class="dropdown-menu"> <li> <a href="#">2-level Dropdown <i class="icon-arrow-right pull-right"></i></a> <ul class="dropdown-menu sub-menu"> <li><a href="#">Action</a></li> <li><a href="#">Another action</a></li> <li><a href="#">Something else here</a></li> </ul> </li> <li><a href="#">Another action</a></li> <li class="divider"></li> <li><a href="#">One more separated link</a></li> </ul> </li> </ul> </div> </div> ``` But when I run this code on FireFox (Chrome and IE are oke), "icon-arrow-right" and "2-level Dropdown" aren't same a line . How can I fix it ? Full code on JSFIDDLE