...specifically, do you think they used a border to create the embossed look of the line below each item? When I tried to recreate something using groove, ridge and inset border styles, none of them looked like this. Do you think they used one a lighter color for the top border and a darker color for the bottom boarder to create that effect?

I really like the way the menu looks. Thanks for any help.

There are using this image combined with CSS
something like (assuming the link have class="mylink"):

.mylink a{
        background-image:...
        background-position:... /* so it shows the BOTTOM of the image */
        background-repeat:...
        }
.mylink a:hover{
        background-position:... /* so it shows the TOP of the image */
        }

Ohhh. That makes sense. I'm relatively new with CSS and am constantly in search of how "they do the cool stuff." Thanks so much!

You can also cheat it by using two borders, one a light colour and one a dark:

e.g.

<div style="border-top:  1px solid #F0F0F0; border-bottom:  1px solid #A0A0A0; background-color:  #CCCCCC;">
...
</div>

Will give you a similar effect with no graphics required (replace with your own colours.)

The leaf would have to be an image, but everything else could be coded with css. The embossed line looks like it could be a simple <hr /> too.

Michelle I wrote a post awhile back about creating simple menus with css. This menu is a little more complicated than the one in my post, but not really all the much. The post might help you understand the basic way to do something like this with css and html lists and hopefully help you take it to the next level like the menu you're showing.

The site that in question uses a lot of unnecessary images!!!

Thanks for the great responses!

Glad to help Michelle. Have you been able to get your menu looking the way you want?