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

Menu item css & border

1 Answer 211 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Vatsal
Top achievements
Rank 2
Vatsal asked on 12 Nov 2010, 07:30 AM
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

1 Answer, 1 is accepted

Sort by
0
Accepted
Shinu
Top achievements
Rank 2
answered on 12 Nov 2010, 10:19 AM
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.
Tags
Menu
Asked by
Vatsal
Top achievements
Rank 2
Answers by
Shinu
Top achievements
Rank 2
Share this question
or