Navigation issues

[mgn2683]

I'm having issues trying to get a little triangle (spike.gif) to appear under the link of a current page. For instance, it won't appear on rollover, but just when someone is on a certain page. I've enclosed a link to an image of how I'd like to do this. http://mgndesign.com/draft/images/about_example.gif

Does anyone have any insight on how to get this accomplished? Thanks ahead of time.

[pritaeas]

You could do the following, provided the image contains only the triangle, and not the text:

li.topnav-current-page:hover {
  background: url(images/about_example.gif) bottom left no-repeat;
}

[mgn2683]

I used this code and it definitely helped! But now I have two issues: first it doesn't appear in the middle of the navigation item, it always appears in the left. I would also like to have the spike be there automatically on the page. For instance, if it is the 'About' page, then it would automatically be there, whether hover or not. I appreciate the help so far!

[pritaeas]

#menu ul li.topnav-current-page {
  background: url(images/about_example.gif) bottom center no-repeat;
}
#menu ul li.topnav:hover {
  background: url(images/about_example.gif) bottom center no-repeat;
}