How to create HTML menu with CSS

We can create simple menu using followng steps:

Step 1. Create a DIV :
div style="float:right;" id="my_menu" class="sdmenu">
div style="width:150px">
a href="addrec.html">Add Record
a href="modrec.html">Modify Record
a href="printrecord.html">Print Record
a href="printinvoice.html">Print Invoice
a href="showall.html">All Records
a href="login.html">Logout
/div>
div

Step2 : Apply follwoing CSS :
div.sdmenu {
width: 150px;
font-family: Arial, sans-serif;
font-size: 12px;
padding-bottom: 10px;
background: url(../img/bottom.gif) no-repeat right bottom;
color: #fff;
margin-left:45px
}

div.sdmenu div a {
padding: 5px 10px;
background: #A70707;
display: block;
border-bottom: 1px solid #ddd;
color: #ffffff;
}
div.sdmenu div a.current {
background : #ccc;
}
div.sdmenu div a:hover {
background : #D6ECA6 no-repeat right center;
color: #006666;
text-decoration: none;
}

we can change color as wanted on hover the item.