This is a migrated thread and some comments may be shown as answers.

Need to separate groups of menu items

1 Answer 28 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Lynn
Top achievements
Rank 2
Lynn asked on 03 Mar 2011, 07:33 PM
I am styling the Telerik menu using only CSS (no skins).  It is working fine and the results are good, except...I would like to visually separate cascading groups.

I have attached a small screen capture of the current menu with the "Buy" menu selected, and the detail "Search..." item selected.  The items to the right (Search by City, Search by Zip Code, etc.) are items under "Search...".

I would like to visually separate the lower level group (Search by City, Search by Zip Code, etc.) from the second level (Search..., Buying a Home, etc.) with a small (say 3 or 4 pixel) gap where the RED line is drawn on the graphic.

I should probably add that I am NOT setting the width of the items, I am letting the width "float" automatically based on the text contents.

Can you tell me how I can do this using CSS?

Thank you in advance for the assistance!

Lynn

1 Answer, 1 is accepted

Sort by
0
Kate
Telerik team
answered on 07 Mar 2011, 04:00 PM
Hello Lynn,

One way to achieve this is to set the following css class selector to the level you need (one, two etc.):
Copy Code
.RadMenu_Default .rmLevel2
        {
            left: 15px !important;
        }

Regards,
Kate
the Telerik team
Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
Tags
Menu
Asked by
Lynn
Top achievements
Rank 2
Answers by
Kate
Telerik team
Share this question
or