it has a great style and its simple and easy. i would prefer a transl. and blending feature on this.

very nice vertical menu! thanks for sharing!

thats nice

For horizontal, include 'display: inline;' in your style sheet. Nice looking. Is on our intranet right now! He he he!

There are 2 different versions of this tutorial so you can choose which one suits your application best. (first is best).

1. Using HTML lists
Uses the least amount of html, always a good thing.
2. Using tables
The original version of this tutorial and the common way menus are often created.
In practice both methods operates much the same way. Using lists requires the least amount of HTML (some of us hand-coders are lazy) and it's also the method I recommend.

Great style,thanks for the code..

csscss

Wow! Great work there. Beautiful menu. Thank you very much..

ad.comc4i.com

wow, it looks really great, thanks!

regards,
Mak

How can i integrate of second level to this menu

Malik

<style>
#button {
width: 777px;
border-right: 1px solid #000;
padding: 0 0 0 0;
margin-bottom: 1em;
font-family: 'Trebuchet MS', 'Lucida Grande', Arial, sans-serif;
font-size: 90%;
background-color: #90bade;
color: #333;
}

#button li {
border-bottom: 1px solid #90bade;
margin: 0;
list-style: none;
margin: 0;
padding: 0;
border: none;
float:left

}

#button li a {
display: block;
padding: 5px 5px 5px 0.5em;
border-left: 5px solid #1958b7;
border-right: 5px solid #508fc4;
background-color: #2175bc;
color: #fff;
text-decoration: none;
width: 100%;
}

html>body #button li a {
width: auto;
}

#button li a:hover {
border-left: 5px solid #1c64d1;
border-right: 5px solid #5ba3e0;
border-top: 2px solid #1c64d1;
border-bottom: 2px solid #5ba3e0;
background-color: #2586d7;
color: #fff;
}
</style>

<div id="button">
<li>Home
<li>Toys and Games
<li>Computers
<li>Electronics
<li>Furniture
<li>Outdoors
<li>Home Appliances
</div>