I tried to align the icon in the drop-down list with the class 'pull-left', and now it is not vertically aligned in the center, the main problem is that I do not want to use pure css to fix this, because I'm sure there is a solution with bootstrap, built into the class, but cannot find them on its own. I'm right?
<div class="navbar"> <div class="navbar-inner"> <a class="brand" href="#">Dbgr.lt</a> <ul class="nav"> <li class="active"><a href="#">Posts</a></li> <li><a href="#">Blogs</a></li> <li><a href="#">Questions</a></li> <li><a href="#">People</a></li> </ul> <ul class="nav pull-right"> <li class="dropdown" id="fat-menu"> <a data-toggle="dropdown" class="dropdown-toggle text-center" role="button" id="drop3" href="#" style="min-width: 100px;"> <i class="icon-user pull-left"></i> Admin <b class="caret"></b> </a> <ul aria-labelledby="drop3" role="menu" class="dropdown-menu"> <li role="presentation"><a href="#" tabindex="-1" role="menuitem">Action</a></li> <li role="presentation"><a href="#" tabindex="-1" role="menuitem">Another action</a></li> <li role="presentation"><a href="#" tabindex="-1" role="menuitem">Something else here</a></li> <li class="divider" role="presentation"></li> <li role="presentation"><a href="#" tabindex="-1" role="menuitem">Separated link</a></li> </ul> </li> </ul> </div> </div>
Fiddle: http://jsfiddle.net/HX6ef/
source share