CSS Nav: Image on the Hover?

[1234567890]

Dear CSS Gods:

I have run into the classic CSS ul nav issue, and need your expertly and Godly help.

Review the site I am working on here: site link. I am using a css nav with the ul for proper markup, and I need an image to show up on the hover - but to show up on the bottom of the nav bar.

Look at what the nav should look like at this link here. I need to duplicate this menu, but not the way the previous developer has done it. I have changed it to a css menu, but I need help putting the fancy image on the hover - where there is a triangle at the bottom of the image.

If you could please help me or point me in the right direction on solving this, I would greatly appreciate your help.

[Fang]

An image rollover?

[1234567890]

Is there a way to provide padding per each link, as some have padding and others are over the other images towards the end.

http://www.petpinpoint.com/awreed/test

[Coyotelab]

#nav li a { float: left; display:block; height: 50px;  }

however you didn't follow the guide link that Fang posted