Highlight li

I am using the boutique template and trying to highlight the li when hovered. See image here:http://www.freeimagehosting.net/fsfos. It will not highlight evenly the li. How can i fix this?

Thank you in advanced.

David

Image is not clear, can you please post a link to a page or your website so we can make a suggestion, also is this for menu items ?

See you around...

Is this image better? My website is on a testing server.

This highlight is to happen when hovered. Sorry not to have posted this before.

David

Current hover is in below css

Code: Select all

#gkMainMenu > div > ul > li:hover > a, #gkMainMenu > div > ul > li:active > a, #gkMainMenu > div > ul > li:focus > a {
    color: #E9403B;
}


If you want it for li class hover then use below class. Color fff is for an example, change that as you require.

Code: Select all

#gkMainMenu > div > ul > li:hover { background: #fff; }


See you around...

That is the same code i have. If you look at the image it does not highlight from divider to divider. In the image i have it highlighted. It does not extend all the way to the right. If you look at the image posted now it has a red arrow where the highlight should extend to. Thanks for all the help

Remove left margin and it should be ok

Code: Select all

#gkMainMenu > div > ul > li { margin-left:0px;}
#gkMainMenu > div > ul > li:hover { background: yellow;}
#gkMainMenu > div > ul > li > a { padding-right:16px;}


Thanks normanUK that works!!

No problem at all, see you around...