Hide the icon column for RadMenu items

[Karl]

I want to be able to hide or show the icon column for the RadMenu, but want to be able to turn this column on and off for individual menu items but can't see how to do this.

I found a page that says this is available for the RadMenu for silverlight here http://www.telerik.com/help/silverlight/radmenu-how-to-remove-the-icon-area-for-radmenu.html but even this suggests its either on or off for all items in a menu and cant be set for each one.

Can anyone tell me if this can be done, and if it can, how?

Thanks.

[Kate]

Hello Karl,

To be able to achieve this effect with the ASP.NET AJAX RadMenu control you will need to use a css class selector and apply it to the child items of the RadMenu control using the CssClass property. However, since the CssClass property that could be used is applied to the <a> element of the RadMenu and the padding/margin that you need to remove is put to a <span> element that is in the <a> element,  you can not use the above mentioned property for this purpose. One way to remove the space is to apply the following css class selector:

div.RadMenu .rmGroup .rmText {
    margin: 0 0 0 -21px;
    padding: 0 54px 0 28px;
}

Unfortunately it will not take effect to the individual items but to the whole group of child items.
 

Best wishes,
Kate
the Telerik team

[Mattias]

Old post but!
You need to remove background as well:

.RadMenu .rmGroup {
    background-image:none !important;
}

.RadMenu .rmGroup .rmLink .rmText {
    text-align: left !Important;
    padding-left:5px !Important;
    margin-left:2px !Important;
}

/Mattias

[Alain]

Hello,

Why not use the built in feature :

Since Q2 2010 RadMenu has a property for defining the width of the column, which is reserved for the Icons. The property is called IconColumnWidth. And when set to 0 the space for the Icon disappears.

[Raymond]

IconColumnWidth applies to Silverlight and not Ajax