[Solved] Offset Menu Item

[Ed]

I have a menu that is being driven by a site map data source.  It works great but I need to have the first item offset from the left by the 48px.  What is the best way to create this offset?


Thanks in advance!

[Paul]

Hello Ed,

Please find below a sample code snippet that shows the needed approach.

ASPX:

<form runat="server" id="mainForm" method="post">
<telerik:RadScriptManager ID="ScriptManager" runat="server" />
<telerik:RadMenu
    ID="RadMenu1"
    runat="server"
    DataSourceID="SiteMapDataSource1"
    OnPreRender="RadMenu1_PreRender">
</telerik:RadMenu>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
</form>

Code-behind:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Telerik.Web.UI;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected void RadMenu1_PreRender(object sender, EventArgs e)
    {
        foreach (RadMenuItem item in RadMenu1.Items)
        {
            if (item.Items.Count != 0)
            {
                item.GroupSettings.OffsetX = 48;
            }
        }
    }
}

Regards,
Paul
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Ed]

That didn't seem to work.  Instead of offsetting the root items, it offset the child items so that the driop down menu was offset.

[Paul]

Hi Ed,

You can offset a child group only. OffsetX and OffsetY are properies of the GroupSettings.

Still, we don't see any logic to offset the root items. We suppose you have vertical menu; if so, why dont you just move to the whole menu with 48px to the right?

Regards,
Paul
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Ed]

The menu is horizontal.   The Company Logo will be positioned so that part of it is over the menu on the left hand side.  So we would like the first menu item offset by the image overhang.  We will be allowing the user to apply styles so we want the menu bar to draw itself across the full width of the page so teh style of the menu will be consistant across the top.

I think I found a way to do it.  I will add a visible disabled menu item with " " as the text as the first item.  Then I will set the width of that item to the desired offset.