centering (horizontally and vertically) <ul> in navbr div

Question

I know this has been addressed previously, but for the life of me I can't get it to work with my code (yes, I'm new to this so please be gentle, and do let me know if I am going against SO etiquette!).

Basically, trying to setup a navbar with links centered vertically that become highlighted when hovered over.
I got it setup by eyeballing it and adjusting the margins / padding, but surely there is a better way to to go about this.

Also, how do I go about centering the links horizontally as well?

Here's the relevant code. http://jsbin.com/wekuqidu/1/

Thanks all!!!!

Answer 1

Here is an example using line-height, you can also try using table-cell to vertically align in the middle

http://jsbin.com/nagoposu/2/