简体   繁体   中英

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 :)

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>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM