Menu item css & border

2 posts, 1 answers
  1. Vatsal
    Vatsal avatar
    26 posts
    Member since:
    Oct 2010

    Posted 12 Nov 2010 Link to this post

    Hi,

    How can I implement two different css class for

    1. Menu Item not selected
    2. Menu Item selected

    I don't want to set it from code behind. Is there any way to set it from aspx page itself. Something like, SelectedItemCssClass="ItemSelected" and ItemCssClass="MenuItem" etc.

    Also, I want to remove border of menu control. How can I do this? I tried " BorderStyle="None" BorderWidth="0px" " but it's not working.

    I am using below code to implement telerik menu control in my website.

    1) Static Menu
    <telerik:RadMenu ID="RadMenu1" runat="server" Width="600px" EnableRoundedCorners="true"
    EnableShadows="true" BackColor="White" BorderStyle="None" BorderWidth="0px">
        <Items>
            <telerik:RadMenuItem Text="Home" Value="Home" Width="100px" NavigateUrl="MainPage.aspx" />
            <telerik:RadMenuItem Text="About Us" Value="About Us" Width="100px" />
            <telerik:RadMenuItem Text="Careers" Value="Careers" Width="100px" />
            <telerik:RadMenuItem Text="Contact Us" Value="Contact Us" Width="100px" />
            <telerik:RadMenuItem Text="Privacy" Value="Privacy" Width="100px" />
            <telerik:RadMenuItem Text="Help" Value="Help" Width="95px" />
        </Items>
    </telerik:RadMenu>

    2) Dynamic Menu
    <telerik:RadMenu ID="RadMenu2" runat="server" Width="190px" EnableRoundedCorners="true"
    EnableShadows="true" DefaultGroupSettings-RepeatDirection="Vertical" DefaultGroupSettings-RepeatColumns="1"
    EnableSelection="true" OnItemDataBound="RadMenu2_ItemDataBound"/>

    Thanks,
    Vatsal

  2. Answer
    Shinu
    Shinu avatar
    17588 posts
    Member since:
    Mar 2007

    Posted 12 Nov 2010 Link to this post

    Hello Vatsal,


    RadMenuItem objects have a number of properties whose value is the name of a CSS class. These properties let you alter the appearance of individual items in the menu without using a custom skin. It includes SelectedCssClass and CssClass.

    More information will be available here:
    Setting the CSS Class of Items

    And to hide the border of the menu, add the following css on page:

    <style type="text/css">
        .RadMenu_Default .rmRootGroup
        {
            border: none !important;
        }
    </style>



    -Shinu.

Back to Top