Question

http://jsfiddle.net/9aaNh/

Please check this Fiddle. I am having problem with spacing in between text and background image in HOVER.

This is working good but I don’t know why I am unable to put the image just infront of the texts. In this Fiddle The image appearing on over is just on the corner where my requirement is it to be appeared just before the text

Here is the image what I am Having now

And I want

I did that with using Javascript and here is the following fiddle

http://jsfiddle.net/jhilomhaldar1/bNcgH/1/

But The problem with this code that onover the boxes are moving too much. I am really confused and don’t know what to do

Answer 1

just change the css to

#nav li:hover {
    background: url("http://i.imgur.com/IhyGC.png") no-repeat scroll 5px 12px #3EBBEC;
    color: #FFFFFF;
}

hope u expected this output