How to create the dropdown arrow from Twitter's Bootstrap?

Question

I've been checking/using Twitter Bootstrap for quite a while now. I like what they've done, but more than that, I like understanding what I do.

After inspecting the dropdown arrow with Chrome's inspector, it seems it is in fact a ↓ html entity. I've been trying to reproduce this but with no success. I'm getting an ugly arrow and not the simple triangle.

What are the minimum CSS properties to use in order to reproduce it?

PS: A link to a jsFiddle trying to reproduce it.

Answer 1

Here's a working example.

You don't need the extra ↓ in your HTML and the border-color was white, making it invisible on a white background to your very human eyes.