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

Rad Menu Item Align centre

1 Answer 34 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Grant
Top achievements
Rank 1
Grant asked on 30 Jul 2014, 10:36 AM
Hi

Im having a problem aligning my submenu text.

Its not inheriting the same style as the menu.



 <telerik:RadMenu ID="Menu" class="menu" runat="server" Flow="Vertical" 
                                 width="270px" ExpandAnimation-Duration="300" EnableEmbeddedSkins="False" 
                                 ForeColor="Black" >

                                     <Items>
                                        <telerik:RadMenuItem runat="server" Text="Some Text" Height="40px" Font-Size="16px" 
                                             Font-Bold="true" ImageUrl="images/Sphere.png" NavigateUrl="~/Some Text.aspx" >
                                        </telerik:RadMenuItem>
                                        <telerik:RadMenuItem runat="server" Text="Some Text" Height="40px" Font-Size="16px" 
                                             Font-Bold="true" ImageUrl="images/Sphere.png" NavigateUrl="~/Some Text.aspx" >
                                        </telerik:RadMenuItem>
                                        <telerik:RadMenuItem runat="server" Text="Some Text" Height="40px" Font-Size="16px" 
                                             Font-Bold="true" ImageUrl="images/Sphere.png" NavigateUrl="~/Some Text.aspx" >
                                        </telerik:RadMenuItem>
                                        <telerik:RadMenuItem runat="server" Text="Some Text" Height="40px" Font-Size="16px" 
                                         Font-Bold="true" ImageUrl="images/Sphere.png" NavigateUrl="~/Some Text.aspx">
                                        </telerik:RadMenuItem>
                                        <telerik:RadMenuItem runat="server" Text="Some Text" Height="40px" Font-Size="16px" 
                                             Font-Bold="true" ImageUrl="images/Sphere.png" NavigateUrl="~/Some Text.aspx">
                                        </telerik:RadMenuItem>
                                        <telerik:RadMenuItem runat="server" Text="Some Text" Height="40px" 
                                             Font-Size="16px" Font-Bold="true" ImageUrl="images/Sphere.png" >
                                            <Items>
                                                <telerik:RadMenuItem runat="server" Text="Some Text" Height="40px"
                                                    Font-Size="16px" Font-Bold="true" ImageUrl="images/Sphere.png" 
                                                    NavigateUrl="~/Some Text.aspx" >
                                                </telerik:RadMenuItem>
                                                <telerik:RadMenuItem runat="server" Text="Some Text" Height="40px" 
                                                    Font-Size="16px" Font-Bold="true" ImageUrl="images/Sphere.png" 
                                                    NavigateUrl="~/Some Text.aspx">
                                                </telerik:RadMenuItem>
                                                <telerik:RadMenuItem runat="server" Text="Some Text" Height="40px"
                                                    Font-Size="16px" Font-Bold="true" ImageUrl="images/Sphere.png" 
                                                    NavigateUrl="~/Some Text.aspx"  >
                                                </telerik:RadMenuItem>
                                                <telerik:RadMenuItem runat="server" Text="Some Text" Height="40px" 
                                                    Font-Size="16px" Font-Bold="true" ImageUrl="images/Sphere.png" 
                                                    NavigateUrl="~/Some Text.aspx" >
                                                </telerik:RadMenuItem>
                                                <telerik:RadMenuItem runat="server" Text="Some Text" Height="40px" 
                                                    Font-Size="16px" Font-Bold="true" ImageUrl="images/Sphere.png" 
                                                    NavigateUrl="~/Some Text.aspx" >
                                                </telerik:RadMenuItem>
                                                <telerik:RadMenuItem runat="server" Text="Some Text" Height="40px"
                                                    Font-Size="16px" Font-Bold="true" ImageUrl="images/Sphere.png" 
                                                    NavigateUrl="~/Some Text.aspx" >
                                                </telerik:RadMenuItem>
                                                 <telerik:RadMenuItem runat="server" Text="Some Text" Height="40px"
                                                    Font-Size="16px" Font-Bold="true" ImageUrl="images/Sphere.png" 
                                                    Target = "_blank" NavigateUrl="~/Some Text.aspx" > 
                                            
                                                </telerik:RadMenuItem>

When I hover iver the last tab, it displays a new tab but the text is not correctly aligned

Your help would be much appreciated.

Grant



 

1 Answer, 1 is accepted

Sort by
0
Magdalena
Telerik team
answered on 01 Aug 2014, 08:41 AM
Hi Grant,

We have run the code that you had provided, but it seems that there are missing some stylesheets. This is a video as a part of the testing. In general, if you would like to center the text in the items, you can make it by the property "text-align" as the following:
.rmText {
    text-align: center;
}

If you would like to achieve some different behavior, we would like to ask you to provide us with your project.

We would like also recommend you some improvements for your project - a good practice is avoiding the usage of inline CSS if it is not necessary. Instead of that you can set the styles property in separate file which is appreciable easier for further maintenance. Please, find a sample project in the attachment based on the code that you provided.

Regards,
Magdalena
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Menu
Asked by
Grant
Top achievements
Rank 1
Answers by
Magdalena
Telerik team
Share this question
or