Image Question

[comptech520]

Hello,

On this site http://djshawnmichaels.com/testmenu/

Look for the features button, I want to add a graphic after the word features, but part of the same button.

This is the line of code for the feature button:
<li><a href="#" onMouseover="cssdropdown.dropit(this,event,'dropmenu3')">Features</a></li>

How would I go about doing this?

Thank you kindly

[KDLA]

You can add it as the background-image for your link:

<li>
<a href="#" onMouseover="cssdropdown.dropit(this,event,'dropmenu3')" style="background: url(file.gif) no-repeat right;">
Features
</a>
</li>

The button looks pretty small - you may have to change some of the spacing.

[comptech520]

Thanks, that helped It took out my divider by me adding that in there, so with having this
<li>
<a href="#" onMouseover="cssdropdown.dropit(this,event,'dropmenu3')" style="background: url(file.gif) no-repeat right;">
Features
</a>
</li>

Is there a way to add another image right after my arrow?

Thanks

[KDLA]

How do you have the dividers inserted for the other links? Is it part of the background image? If so, all you need to do is adjust the padding/widths for that button and some of the neighboring buttons so that it reappears.

[comptech520]

I played with the padding, and the same thing happens with no dividor bar. In my css for the menu, this is the code for the divider bar:

#chromemenu ul li a{
float: left;
color: #AA1111;
font-weight: bold;
padding: 6px 11px 6px 11px;
text-decoration: none;
background: url(divider.gif) center right no-repeat; /*Theme Change here*/
}

So would there be a way that I could add the divider manually?

Thanks

[KDLA]

You might try:

<li>
<a href="#" onMouseover="cssdropdown.dropit(this,event,'dropmenu3')" style="background: url(file.gif) no-repeat right;">
Features
</a>
<span style="background: url(divider.gif) no-repeat; width: 2px;"></span>
</li>