Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Bootstrap dropdown button heights different

here is my html:

<div class="row-fluid">
  <div class="span3">
     <div class="btn-group">
         <a class="btn btn-primary" href="#"><i class="icon-user"></i> User</a>
         <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
         <span class="icon-caret-down"></span>
         </a>
         <ul class="dropdown-menu">
         <li><a href="#"><i class="icon-fixed-width icon-pencil"></i> Edit</a></li>
         <li><a href="#"><i class="icon-fixed-width icon-trash"></i> Delete</a></li>
         <li><a href="#"><i class="icon-fixed-width icon-ban-circle"></i> Ban</a></li>
         <li class="divider"></li>
         <li><a href="#"><i class="i"></i> Make admin</a></li>
         </ul>
      </div>
   </div>
</div>

This is a simple example from: http://fortawesome.github.io/Font-Awesome/examples/

And in my browser chrome, the output is:

I use FontAwesome, and i want just try the icons. Pls help, thank you :)

like image 210
DevMetal91 Avatar asked Aug 27 '13 22:08

DevMetal91


1 Answers

Try adding <!DOCTYPE html> to the beginning of your HTML file.

According to the docs:

Bootstrap makes use of certain HTML elements and CSS properties that require the use of the HTML5 doctype. Include it at the beginning of all your projects.

So wrap your Bootstrap HTML files in the following:

<!DOCTYPE html>
<html lang="en">
  ...
</html>
like image 88
edsioufi Avatar answered Sep 22 '22 17:09

edsioufi