displaying dynamic menu on mouse click ASP.NET Menu Control

Question

Hi I am having a asp.net (4.0) menu control to populate the menu's am fetching data from sql server. I need help on adding the below two 1. I would like to change menu behaviour of displyaing the dynamic menu from on mouse over to mouse click 2. How can i add a separator or hr line in between two sub menus. Your help is much appreciated thank in advance.

Iftikar Hussain · Answer

Hi You can do using CSS like below /* Horizontal Menu Styles Start */ .nav-bar { background-color: #006DAA; padding: 0 10px; width: 100%; } .nav-bar:after { clear: both; content: .; display: block; font-size: 0; height: 0; line-height: 0; overflow: hidden; } div.nav-bar ul { float: left; list-style: none outside none; margin: 0; padding: 0; position: relative; width: 100%; } div.nav-bar ul li { float: left; } div.nav-bar li { position: relative; text-align: left; } div.nav-bar li a { border-right: 1px solid #0A77B4; } div.nav-bar a { color: #FFFFFF; float: left; font-family: Arial; font-size: 12px; font-weight: normal; line-height: 30px; padding: 0 20px; text-decoration: none; text-align: center; } div.nav-bar a:hover { background-color: #004582; color: #FFFFFF; text-decoration: none; } .level2 { width: 100%; z-index: 1000; } .level2 ul { border-top: 1px solid #2D444F; left: -10000px; padding-bottom: 3px; position: absolute; top: 27px; text-align: left; } .level2 li { border-bottom: 1px solid #BABABA; text-align: left; background-color:#CECECE; padding: 0px; } .level2 li a { color: #000000; text-align: left; width: 160px; } .level2 li a:hover { background-color: #004582; color: #FFFFFF; } /* Horizontal Menu Styles End */ IncludeStyleBlock=false ItemWrap=false Orientation=Horizontal SkipLinkText=> Regards Iftikar