Menu - Right-to-left Support

This RadMenu is in RTL mode:

  • File
    • New
    • Open
    • Save
    • Save As
    • Print Preview
    • Print
    • Close
  • Edit
    • Undo
    • Cut
    • Copy
    • Paste
    • Clipboard...
  • Insert
    • Break...
    • Page Numbers...
    • Date and Time...
    • Field...
    • Symbol...
    • Comment
    • Picture
    • Diagram
    • Text Box
    • Hyperlink
  • Format
    • Font
      • Arial
      • Verdana
      • Tahoma
      • Sans-serif
      • Arial
      • Arial Black
      • Arial Narrow
      • Arial Unicode MS
      • Bookman Old Style
      • Bookshelf Symbol 7
      • Century
      • Century Gothic
      • Comic Sans MS
      • Courier New
      • Garamond
      • Georgia
      • Goudy Old Style
      • Goudy Stout
      • Haettenschweiler
      • Helvetica
      • Impact
      • Imprint MT Shadow
      • Latha
      • Lucida Console
      • Lucida Sans
      • Lucida Sans Typewriter
      • Lucida Sans Unicode
    • Paragraph...
    • Bullets and Numbering...
    • Borders and Shading...
    • Columns
    • Tabs
    • Change Case
    • Theme
    • Frames
    • Autoformat
  • View
    • Normal
    • Web Layout
    • Print Layout
    • Task Pane
  • Tools
    • Spelling And Grammar...
    • Research...
    • Language
    • Word Count...
    • Track Changes
    • Compare And Merge Documents..

This RadMenu is in LTR mode:

  • File
    • New
    • Open
    • Save
    • Save As
    • Print Preview
    • Print
    • Close
  • Edit
    • Undo
    • Cut
    • Copy
    • Paste
    • Clipboard...
  • Insert
    • Break...
    • Page Numbers...
    • Date and Time...
    • Field...
    • Symbol...
    • Comment
    • Picture
    • Diagram
    • Text Box
    • Hyperlink
  • Format
    • Font
      • Arial
      • Verdana
      • Tahoma
      • Sans-serif
      • Arial
      • Arial Black
      • Arial Narrow
      • Arial Unicode MS
      • Bookman Old Style
      • Bookshelf Symbol 7
      • Century
      • Century Gothic
      • Comic Sans MS
      • Courier New
      • Garamond
      • Georgia
      • Goudy Old Style
      • Goudy Stout
      • Haettenschweiler
      • Helvetica
      • Impact
      • Imprint MT Shadow
      • Latha
      • Lucida Console
      • Lucida Sans
      • Lucida Sans Typewriter
      • Lucida Sans Unicode
    • Paragraph...
    • Bullets and Numbering...
    • Borders and Shading...
    • Columns
    • Tabs
    • Change Case
    • Theme
    • Frames
    • Autoformat
  • View
    • Normal
    • Web Layout
    • Print Layout
    • Task Pane
  • Tools
    • Spelling And Grammar...
    • Research...
    • Language
    • Word Count...
    • Track Changes
    • Compare And Merge Documents..
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

Thi demo exemplifies how you can use the RadMenu control for RTL languages.

The control takes into consideration the direction attribute set to the control itself or any parent HTML element. If you set the direction of the body tag (or any other parent element that contains the control) to rtl, RadMenu reverses the item order and aligns itself to the right side of the container.

<telerik:RadMenu ID="RadMenu1" runat="server" dir="rtl" ... />
  • DefaultCS.aspx
<%@ Page Language="c#"  %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />

    <div class="demo-container size-medium">
        <h2>This RadMenu is in RTL mode:</h2>
        <telerik:RadMenu RenderMode="Lightweight" ID="RadMenu1" runat="server" dir="rtl" Style="z-index: 1" EnableRoundedCorners="true"
            EnableShadows="true">
            <Items>
                <telerik:RadMenuItem Text="File" AccessKey="F">
                    <Items>
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/11new.gif" Text="New" AccessKey="w" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/12open.gif" Text="Open" AccessKey="O" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/13Save.gif" Text="Save" AccessKey="S" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/14SaveAs.gif" Text="Save As" AccessKey="A" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/15printPreview.gif" Text="Print Preview"
                            AccessKey="V" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/16print.gif" Text="Print" AccessKey="P" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/17close.gif" Text="Close" AccessKey="C" />
                    </Items>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="Edit" AccessKey="E">
                    <Items>
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/21undo.gif" Text="Undo" AccessKey="U" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/cut.png" Text="Cut" AccessKey="T" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/copy.png" Text="Copy" AccessKey="C" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/paste.png" Text="Paste" AccessKey="P" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/23clipboard.gif" Text="Clipboard..."
                            AccessKey="b" />
                        <telerik:RadMenuItem IsSeparator="True" />
                    </Items>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="Insert" AccessKey="I">
                    <Items>
                        <telerik:RadMenuItem Text="Break..." AccessKey="B" />
                        <telerik:RadMenuItem Text="Page Numbers..." AccessKey="U" />
                        <telerik:RadMenuItem Text="Date and Time..." AccessKey="T" />
                        <telerik:RadMenuItem Text="Field..." AccessKey="F" />
                        <telerik:RadMenuItem Text="Symbol..." AccessKey="S" />
                        <telerik:RadMenuItem Text="Comment" AccessKey="M" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem Text="Picture" AccessKey="P" />
                        <telerik:RadMenuItem Text="Diagram" AccessKey="G" />
                        <telerik:RadMenuItem Text="Text Box" AccessKey="X" />
                        <telerik:RadMenuItem Text="Hyperlink" AccessKey="I" />
                    </Items>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="Format" AccessKey="O">
                    <Items>
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/26Font.gif" Text="Font" GroupSettings-Height="200">
                            <Items>
                                <telerik:RadMenuItem Text="Arial" />
                                <telerik:RadMenuItem Text="Verdana" />
                                <telerik:RadMenuItem Text="Tahoma" />
                                <telerik:RadMenuItem Text="Sans-serif" />
                                <telerik:RadMenuItem IsSeparator="true" />
                                <telerik:RadMenuItem Text="Arial" />
                                <telerik:RadMenuItem Text="Arial Black" />
                                <telerik:RadMenuItem Text="Arial Narrow" />
                                <telerik:RadMenuItem Text="Arial Unicode MS" />
                                <telerik:RadMenuItem Text="Bookman Old Style" />
                                <telerik:RadMenuItem Text="Bookshelf Symbol 7" />
                                <telerik:RadMenuItem Text="Century" />
                                <telerik:RadMenuItem Text="Century Gothic" />
                                <telerik:RadMenuItem Text="Comic Sans MS" />
                                <telerik:RadMenuItem Text="Courier New" />
                                <telerik:RadMenuItem Text="Garamond" />
                                <telerik:RadMenuItem Text="Georgia" />
                                <telerik:RadMenuItem Text="Goudy Old Style" />
                                <telerik:RadMenuItem Text="Goudy Stout" />
                                <telerik:RadMenuItem Text="Haettenschweiler" />
                                <telerik:RadMenuItem Text="Helvetica" />
                                <telerik:RadMenuItem Text="Impact" />
                                <telerik:RadMenuItem Text="Imprint MT Shadow" />
                                <telerik:RadMenuItem Text="Latha" />
                                <telerik:RadMenuItem Text="Lucida Console" />
                                <telerik:RadMenuItem Text="Lucida Sans" />
                                <telerik:RadMenuItem Text="Lucida Sans Typewriter" />
                                <telerik:RadMenuItem Text="Lucida Sans Unicode" />
                            </Items>
                        </telerik:RadMenuItem>
                        <telerik:RadMenuItem Text="Paragraph..." AccessKey="P" />
                        <telerik:RadMenuItem Text="Bullets and Numbering..." AccessKey="N" />
                        <telerik:RadMenuItem Text="Borders and Shading..." AccessKey="B" />
                        <telerik:RadMenuItem IsSeparator="true" />
                        <telerik:RadMenuItem Text="Columns" AccessKey="C" />
                        <telerik:RadMenuItem Text="Tabs" AccessKey="T" />
                        <telerik:RadMenuItem Text="Change Case" AccessKey="E" />
                        <telerik:RadMenuItem IsSeparator="true" />
                        <telerik:RadMenuItem Text="Theme" AccessKey="H" />
                        <telerik:RadMenuItem Text="Frames" AccessKey="R" />
                        <telerik:RadMenuItem Text="Autoformat" AccessKey="A" />
                    </Items>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="View" AccessKey="V">
                    <Items>
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/31normal.gif" Text="Normal" AccessKey="N" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/32web.gif" Text="Web Layout" AccessKey="W" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/33print.gif" Text="Print Layout" AccessKey="P" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/34Tasks.gif" Text="Task Pane" AccessKey="p" />
                    </Items>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="Tools" AccessKey="T">
                    <Items>
                        <telerik:RadMenuItem Text="Spelling And Grammar..." AccessKey="S" />
                        <telerik:RadMenuItem Text="Research..." AccessKey="R" />
                        <telerik:RadMenuItem Text="Language" AccessKey="L" />
                        <telerik:RadMenuItem Text="Word Count..." AccessKey="W" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem Text="Track Changes" AccessKey="T" />
                        <telerik:RadMenuItem Text="Compare And Merge Documents.." AccessKey="D" />
                    </Items>
                </telerik:RadMenuItem>
            </Items>
        </telerik:RadMenu>
    </div>

    <div class="demo-container size-medium">
        <h2>This RadMenu is in LTR mode:</h2>
        <telerik:RadMenu RenderMode="Lightweight" ID="RadMenu2" runat="server" EnableRoundedCorners="true" Style="z-index: 2"
            EnableShadows="true">
            <Items>
                <telerik:RadMenuItem Text="File" AccessKey="F">
                    <Items>
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/11new.gif" Text="New" AccessKey="w" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/12open.gif" Text="Open" AccessKey="O" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/13Save.gif" Text="Save" AccessKey="S" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/14SaveAs.gif" Text="Save As" AccessKey="A" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/15printPreview.gif" Text="Print Preview"
                            AccessKey="V" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/16print.gif" Text="Print" AccessKey="P" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/17close.gif" Text="Close" AccessKey="C" />
                    </Items>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="Edit" AccessKey="E">
                    <Items>
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/21undo.gif" Text="Undo" AccessKey="U" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/cut.png" Text="Cut" AccessKey="T" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/copy.png" Text="Copy" AccessKey="C" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/paste.png" Text="Paste" AccessKey="P" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/23clipboard.gif" Text="Clipboard..."
                            AccessKey="b" />
                        <telerik:RadMenuItem IsSeparator="True" />
                    </Items>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="Insert" AccessKey="I">
                    <Items>
                        <telerik:RadMenuItem Text="Break..." AccessKey="B" />
                        <telerik:RadMenuItem Text="Page Numbers..." AccessKey="U" />
                        <telerik:RadMenuItem Text="Date and Time..." AccessKey="T" />
                        <telerik:RadMenuItem Text="Field..." AccessKey="F" />
                        <telerik:RadMenuItem Text="Symbol..." AccessKey="S" />
                        <telerik:RadMenuItem Text="Comment" AccessKey="M" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem Text="Picture" AccessKey="P" />
                        <telerik:RadMenuItem Text="Diagram" AccessKey="G" />
                        <telerik:RadMenuItem Text="Text Box" AccessKey="X" />
                        <telerik:RadMenuItem Text="Hyperlink" AccessKey="I" />
                    </Items>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="Format" AccessKey="O">
                    <Items>
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/26Font.gif" Text="Font" GroupSettings-Height="200">
                            <Items>
                                <telerik:RadMenuItem Text="Arial" />
                                <telerik:RadMenuItem Text="Verdana" />
                                <telerik:RadMenuItem Text="Tahoma" />
                                <telerik:RadMenuItem Text="Sans-serif" />
                                <telerik:RadMenuItem IsSeparator="true" />
                                <telerik:RadMenuItem Text="Arial" />
                                <telerik:RadMenuItem Text="Arial Black" />
                                <telerik:RadMenuItem Text="Arial Narrow" />
                                <telerik:RadMenuItem Text="Arial Unicode MS" />
                                <telerik:RadMenuItem Text="Bookman Old Style" />
                                <telerik:RadMenuItem Text="Bookshelf Symbol 7" />
                                <telerik:RadMenuItem Text="Century" />
                                <telerik:RadMenuItem Text="Century Gothic" />
                                <telerik:RadMenuItem Text="Comic Sans MS" />
                                <telerik:RadMenuItem Text="Courier New" />
                                <telerik:RadMenuItem Text="Garamond" />
                                <telerik:RadMenuItem Text="Georgia" />
                                <telerik:RadMenuItem Text="Goudy Old Style" />
                                <telerik:RadMenuItem Text="Goudy Stout" />
                                <telerik:RadMenuItem Text="Haettenschweiler" />
                                <telerik:RadMenuItem Text="Helvetica" />
                                <telerik:RadMenuItem Text="Impact" />
                                <telerik:RadMenuItem Text="Imprint MT Shadow" />
                                <telerik:RadMenuItem Text="Latha" />
                                <telerik:RadMenuItem Text="Lucida Console" />
                                <telerik:RadMenuItem Text="Lucida Sans" />
                                <telerik:RadMenuItem Text="Lucida Sans Typewriter" />
                                <telerik:RadMenuItem Text="Lucida Sans Unicode" />
                            </Items>
                        </telerik:RadMenuItem>
                        <telerik:RadMenuItem Text="Paragraph..." AccessKey="P" />
                        <telerik:RadMenuItem Text="Bullets and Numbering..." AccessKey="N" />
                        <telerik:RadMenuItem Text="Borders and Shading..." AccessKey="B" />
                        <telerik:RadMenuItem IsSeparator="true" />
                        <telerik:RadMenuItem Text="Columns" AccessKey="C" />
                        <telerik:RadMenuItem Text="Tabs" AccessKey="T" />
                        <telerik:RadMenuItem Text="Change Case" AccessKey="E" />
                        <telerik:RadMenuItem IsSeparator="true" />
                        <telerik:RadMenuItem Text="Theme" AccessKey="H" />
                        <telerik:RadMenuItem Text="Frames" AccessKey="R" />
                        <telerik:RadMenuItem Text="Autoformat" AccessKey="A" />
                    </Items>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="View" AccessKey="V">
                    <Items>
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/31normal.gif" Text="Normal" AccessKey="N" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/32web.gif" Text="Web Layout" AccessKey="W" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/33print.gif" Text="Print Layout" AccessKey="P" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem ImageUrl="~/Menu/Images/34Tasks.gif" Text="Task Pane" AccessKey="p" />
                    </Items>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="Tools" AccessKey="T">
                    <Items>
                        <telerik:RadMenuItem Text="Spelling And Grammar..." AccessKey="S" />
                        <telerik:RadMenuItem Text="Research..." AccessKey="R" />
                        <telerik:RadMenuItem Text="Language" AccessKey="L" />
                        <telerik:RadMenuItem Text="Word Count..." AccessKey="W" />
                        <telerik:RadMenuItem IsSeparator="True" />
                        <telerik:RadMenuItem Text="Track Changes" AccessKey="T" />
                        <telerik:RadMenuItem Text="Compare And Merge Documents.." AccessKey="D" />
                    </Items>
                </telerik:RadMenuItem>
            </Items>
        </telerik:RadMenu>
    </div>

    </form>
</body>
</html>

Find Assistance

Help Us Improve

Was this example helpful?