Navigation hyperlinks only work when mouse is on the text

Question

My navigation button looks different when I mouse over, as it should, though the pointer cursor does not appear until I mouse over the text which is not what I want. I want the

Answer 1

Just add cursor:pointer to your .navButton:hover class Here's an updated fiddle: http://jsfiddle.net/mrchief/7SV5K/

This will solve your style issue. However, for button click to happen, you need attach a click handler for the li too.