<Br/> <style> <p> body {</p> <p> font-family: verdana, helvetica, arial, sans-serif; </p> <p >}</p> <p> # mainMenu {</p> <p> background-color: # EEE; </p> <p> border: 1px solid # CCC; </p> <p> color: #000; </p> <p> width: 203px; </p> <p >}</p> <p> # menuList {</p> <p> margin: 0px; </p> <p> padding: 10px 0px 10px 15px; </p> <p >}</p> <p> li. menubar {</p> <p> background: url (/images/plus.gif) no-repeat 0em 0.3em; </p> <p> font-size: 12px; </p> <p> line-height: 1.5em; </p> <p> list-style: none outside; </p> <p >}</p> <p>. menu ,. submenu {</p> <p> display: none; </p> <p> margin-left: 15px; </p> <p> padding: 0px; </p> <p >}</p> <p>. menu li ,. submenu li {</p> <p> background: url (/images/square.gif) no-repeat 0em 0.3em; </p> <p> list-style: none outside; </p> <p >}</p> <p>. actuator {</p> <p> background-color: transparent; </p> <p> color: #000; </p> <p> font-size: 12px; </p> <p> padding-left: 15px; </p> <p> text-decoration: none; </p> <p >}</p> <p>. actuator: hover {</p> <p> text-decoration: underline; </p> <p >}</p> <p>. menu li ,. submenu li a {</p> <p> background-color: transparent; </p> <p> color: #000; </p> <p> font-size: 12px; </p> <p> padding-left: 15px; </p> <p> text-decoration: none; </p> <p >}</p> <p>. menu li a: hover, submenu li a: hover {</p> <p>/* border-bottom: 1px dashed #000; */</p> <p> text-decoration: underline; </p> <p >}</p> <p> span. key {</p> <p> text-decoration: underline; </p> <p >}</p> </style> <ul id = "menuList"> <li class = "menubar"> <p> Phones </p> <ul id = "productsMenu" class = "menu"> <li> <p> New Phones </p> <ul id = "newPhonesMenu" class = "submenu"> <li & gt; 9290 </li> <li> 8390 </li> <li> 8290 </li> <li> 8270 </li> </ul> </li> <li> <p> Compare </p> <ul id = "compareMenu" class = "submenu"> <li> All Phones </li> <li> Service Provider </li> </ul> </li> </ul> <p>