Question

I got the twitter bootstrap dropdown buttons successfully working, but I have a tiny problem. The black navbar here:

http://twitter.github.com/bootstrap/javascript.html#dropdowns

It has a neat little arrow when the dropdown opens, right? Well, I’m using the pills right below and they don’t have that arrow. It seems the arrow is only included when using the navbar, which I don’t need.

Has anyone figured out a way to add the arrows to the pills? 🙁

Answer 1

Assuming you’re referring to the white arrow that points upward when a menu item is clicked, the style you’re looking for is on line 3907 in bootstrap.css:

.navbar .dropdown-menu::after {
  position: absolute;
  top: -6px;
  left: 10px;
  display: inline-block;
  border-right: 6px solid transparent;
  border-bottom: 6px solid white;
  border-left: 6px solid transparent;
  content: '';
}

You can try copying this style and removing the .navbar portion of the style declaration and modify it to fit your code.