A seperator between Menu Nodes

[Ritzie]

   Hello All,
                   I want a Slight separator between nodes in RadMenu at the root node.The separator must be of white color.Please tell me how can I do this.



THanks in advance
ritzie

[Princy]

Hi Ritzie,

I hope using Separator for the RadMenu will help you in achieving this. Also add the CSS given below to change the color of separator.

CSS:

<style type="text/css">
.RadMenu_SkinName .rmRootGroup .rmSeparator,
.RadMenu_SkinName .rmGroup .rmSeparator
{
    background-color: White !important;
}
</style>

ASPX:

<telerik:RadMenu ID="RadMenu1" Runat="server">
     <Items>
            <telerik:RadMenuItem runat="server" Text="Root RadMenuItem1">
                <Items>
                    <telerik:RadMenuItem  IsSeparator="true" ></telerik:RadMenuItem>
                    <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1">
                    </telerik:RadMenuItem>

                    <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2">
                    </telerik:RadMenuItem>
                </Items>
          </telerik:RadMenuItem>
     </Items>
</telerik:RadMenu>

Thanks,
Princy.

[Ritzie]

          Hello Princy,

                               The separator is coming on the vertical List i.e before the items  but I want it after each node on the root group.
I will show u an example Home| Initial Assessment|  and so on.

And the separator must be of white color.




Thankx in advance
Ritzie



        

[Princy]

Hi Ritzie,

Place the seperator according to your need, to get the result. Add the seperator between the main RadMenuItems. Change the SkinName "Default" to the skinname that you are using (in CSS), in the case of using any skin for RadMenu.

ASPX:

<telerik:radmenu id="RadMenu1" runat="server">
    <Items>
        <telerik:RadMenuItem runat="server" Text="File">
            <Items>
                <telerik:RadMenuItem runat="server" Text="New"></telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="Open"></telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="Close"></telerik:RadMenuItem>
            </Items>
        </telerik:RadMenuItem>
        <telerik:RadMenuItem IsSeparator="true"></telerik:RadMenuItem>
        <telerik:RadMenuItem runat="server" Text="Edit">
            <Items>
                <telerik:RadMenuItem runat="server" Text="Copy"></telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="Cut"></telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="Paste"></telerik:RadMenuItem>
            </Items>
        </telerik:RadMenuItem>
        <telerik:RadMenuItem IsSeparator="true"></telerik:RadMenuItem>
        <telerik:RadMenuItem runat="server" Text="Settings">
            <Items>
                <telerik:RadMenuItem runat="server" Text="Basic"></telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="Advanced"></telerik:RadMenuItem>
            </Items>
        </telerik:RadMenuItem>
    </Items>
</telerik:radmenu>

CSS:

<style type="text/css">
.RadMenu_Default .rmRootGroup .rmSeparator,
.RadMenu_Default .rmGroup .rmSeparator
{
    background-color: White !important;
}
</style>

Thanks,
Princy.