I'm trying to figure out a way to use this unicode character ▼ in place of a tiny gif graphic in this menu...

[![Menu using image](https://i.stack.imgur.com/ss6Zx.png)](https://i.stack.imgur.com/ss6Zx.png)

I know I need to use something like:

```
#nav a:hover:after {
    content: "▼";
    color: #fff;
    }

```

But that simply displays the unicode character inline after each menu item like this...

[![Menu with Unicode character](https://i.stack.imgur.com/oEMaB.png)](https://i.stack.imgur.com/oEMaB.png)

I can't figure out how to make the unicode character centered over each menu item like I was able to do with the graphic. Is this possible? Thanks!