Rad Menu Item Align centre

2 posts, 0 answers
  1. Grant
    Grant avatar
    25 posts
    Member since:
    Feb 2014

    Posted 30 Jul 2014 Link to this post

    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



     
  2. Magdalena
    Admin
    Magdalena avatar
    421 posts

    Posted 01 Aug 2014 Link to this post

    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.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top