Telerik Menu

[Anujeet]

hi , 

i am not being able to set proper width of the child dropdown items in the menu . also getting an extra vertical line , something like a separator .
Following is the css used  -

.RadMenu_Css4,
.RadMenu_Css4.rmGroup li
{
 background-image: url(../Images/Menutab_normal.png);
    font-family: Arial;
    font-size: 11px;
    text-decoration: none;
    color:White;
    Width: 145px;
    Height: 20px;
    text-align:left;
    text-indent:8px;
    font-weight:normal;
}

ASPX code
-------------

 <telerik:RadMenu ID="RadMenu1" runat="server" Width="100%" EnableShadows="true"  EnableEmbeddedSkins="false"
                         OnClientItemClicking="fnMenuClick" OnClientMouseOver="fnSubMenuDisplay" Skin="Css4">
                                                 
                    <Items>
                   
                        <telerik:RadMenuItem Text="My WhiteBoard" Width="14%">  
                        </telerik:RadMenuItem>
                       
                        <telerik:RadMenuItem Text="Job Activity" Width="14%">
                            <Items>
                                <telerik:RadMenuItem Text="Job Management">
                                 <GroupSettings Width="120px" />
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Tool Collar Order">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Shipping Monitor">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Bit Run Activity">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Daily Activity Report">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Rig Packet Log">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Status Board">
                                </telerik:RadMenuItem>
                            </Items>
                        </telerik:RadMenuItem>

</Items>
                   </telerik:RadMenu>

secondly , need to know how can i use an arrow in the dropdown menu .

Regards,
Anu

[Kate]

Hello Anujeet,

There are two approaches that you can follow. The first one is to use our Visual Style Builder and create the desired appearance or customized your sprite image as described in this help article and apply it instead of the default one. 

Best wishes,
Kate
the Telerik team

[Anujeet]

hi ,

the solution suggested by u also dint seem to work as expected . the vertical line stays no matter what .
We are unable to get the arrow mark too .

PFA the screen shots for clarification .

Thanks ,
Anu

[Anujeet]

hi ,

as suggested we are now using the Visual Style Builder but still am not able get the alignment of the sub menus as desired . Also not getting the arrow marks and no change in hovereing over . Please find the attached image (menu1.jpg)

Or can we do this with the default skin by only changing the background image and retaining rest of the default menu functionality as it is . (like arrow marks and color changing on hovering over etc )


Thanks ,
Anujeet

[Kate]

Hi Anujeet,

The arrow that you need to add to the menu is a part of the sprite image that is being applied to the control. Using the Visual Style Builder you can not alter the sprite image but either replace it with another one or apply various colors to the different elements of the RadMenu. Therefore I also suggested these articles above. However, since it is a custom skin and due to the different styles applied I will ask you for a live url or to open a support ticket and send us a simplified runnable project that we could inspect locally and come back to you with a suitable solution.

Best wishes,
Kate
the Telerik team