Asp.Net Horizontal Submenu

Question

How do I create an asp:Menu that has a horizontal submenu rather then a vertical one while keeping the top menu horizontal?

Answer 1

The asp.net menu just generates a table. Do something like this:

<div id="nav"><asp:menu .... /></div>

And in your style sheet do something like this:

#nav table { display: inline-block }
#nav tr { display: inline-block }
#nav td { display: inline-block }

You can get really fancy by passing all the parameters to asp:menu and giving each static and dynamic menu item a separate class and styling them all up.

When all else fails, fix it with jQuery on page load.

Answer 2

You may want to look into using the CSS Friendly Adapters. The Menu adapter will render the asp:Menu control using semantic HTML (in this case an unordered list) instead of tables, which makes it much easier to apply CSS to make it do whatever you need it to do.

Answer 3

nav table { display: inline-block }

nav tr { display: inline-block }

nav td { display: inline-block }

This solution works with mozilla but not with IE :(