1

I have an asp.net menu control embedded into a div in my website.

My problem is I will have 15 to 20 menus and the menu control looks cluttered when I show all the menus something like the below.

ASP.NET Menu

I am thinking of applying css to the menu control however i dont know how i can control the amount of items displayed in the menu. I cant remove the items as they are mandatory. What I need is the first 5 menu has to be shown and the rest has to be shown in drop down list or with scroller like the below screenshot

I need the menu control to be displayed like the below one

Tab Drop

or

Arrorw

Can anyone please help me to resolve my issue?

EDIT

I have managed to get all the menus in a single row by changing the list style from list to table.

Menu

This has solved my clutter issue however the menus are going beyond the div view width. I tried changing the width but it didnt helped me. how to set the limit to show only few menus and provide scroll support feature to see the remaining menus.

ASP.NET Menu Scrolling

Karthik Venkatraman
  • 1,619
  • 4
  • 25
  • 55

1 Answers1

0

I think you are looking for something like this: http://www.eyecon.ro/bootstrap-tabdrop/

Let me know if it works out, looks promising, but I never tried it.

EDIT

Ok, I tried it. If you want to have specifically 5 of them or similar. You could do something like this in css:

ul.nav > li {
  width: 15%; 
}

See fiddle here. (Try resizing window)

DDan
  • 8,068
  • 5
  • 33
  • 52
  • Hi, I am looking for something like this. But I cant use the tabdrop as it doesnot support postback feature. Also tabdrop does not work well with asp.net. – Karthik Venkatraman Mar 18 '16 at 09:40