RadMenu rmText overlapping the imageurl image.

[Sreenivas]

Please see the image, as RadMenu has imageURL which is overlapping the text and image. Please provide me the solution for the below code.
Using C#, ASP.NET Q3 2009.


<%

@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

 

<%

 

@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

 

 

<!

 

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

<

 

 

html xmlns="http://www.w3.org/1999/xhtml">

 

<

 

 

head id="Head1" runat="server">

 

 

 

<style type="text/css">

 

 

 

/*We need these lines of code using for Menu Item.*/

 

 

 

.RadMenu .rmGroup .rmText

 

 

{

 

padding: 0 0px 0 0px !important;

 

}

 

 

</style>

 

 

 

<title>Action Menu</title>

 

</

 

 

head>

 

<

 

 

body>

 

 

 

<form id="form1" runat="server">

 

 

 

<asp:ScriptManager ID="ScriptManager1" runat="server">

 

 

 

</asp:ScriptManager>

 

 

 

<telerik:RadToolTipManager ID="ttMng" runat="server" AutoTooltipify="true" ToolTipZoneID="CleasActionMenuControl"

 

 

 

Skin="Web20" ShowCallout="false" AutoCloseDelay="0" HideEvent="LeaveTargetAndToolTip"

 

 

 

Width="300" Visible="true" Animation="Fade">

 

 

 

</telerik:RadToolTipManager>

 

 

 

<telerik:RadToolTipManager ID="RadToolTipManagerImage" ToolTipZoneID="CleasActionMenuControl"

 

 

 

Style="z-index: 1000" ShowCallout="false" Skin="Web20" RelativeTo="Mouse" HideEvent="ManualClose"

 

 

 

Position="BottomRight" Animation="Fade" Width="250px" Height="150px" ContentScrolling="Default"

 

 

 

runat="server" Visible="false" ShowEvent="FromCode">

 

 

 

</telerik:RadToolTipManager>

 

 

 

<telerik:RadMenu ID="CleasActionMenuControl" EnableEmbeddedSkins="true" Skin="Office2007"

 

 

 

CausesValidation="false" Flow="Horizontal" Width="185px" ClickToOpen="false"

 

 

 

runat="server">

 

 

 

<CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation>

 

 

 

<Items>

 

 

 

<telerik:RadMenuItem Enabled="true" Text="Select Action">

 

 

 

<GroupSettings ExpandDirection="Down" Flow="Vertical" OffsetX="0" Width="185px" />

 

 

 

<Items>

 

 

 

<telerik:RadMenuItem Enabled="true" Text="info_light_bg.gif"+"Reopen" ToolTip=""

 

 

 

/>

 

 

 

<telerik:RadMenuItem Enabled="false" Text="Rollover" ImageUrl="info_light_bg.gif"

 

 

 

ToolTip="<strong>You cannot perform this action because there is a reason you can't. \nOtherwise, \nyou'll just see a really long message here in the tooltip. Unless, of course, you can't. In this case, you won't see a really long tooltip, just this.</strong>" />

 

 

 

<telerik:RadMenuItem Enabled="true" Text="Save as New" ToolTip="" />

 

 

 

<telerik:RadMenuItem Enabled="true" Text="Withdraw" ToolTip="" />

 

 

 

</Items>

 

 

 

</telerik:RadMenuItem>

 

 

 

</Items>

 

 

 

</telerik:RadMenu>

 

 

 

</form>

 

</

 

 

body>

 

</

 

 

html>

 

 

[Kate]

Hi Sreenivas,

In order to achieve the desired effect you could change your code like this:

<style type="text/css">

        /*We need these lines of code using for Menu Item.*/
        .RadMenu .rmGroup .rmText
        {
            padding: 0 0px 0 28px !important;
         }

         </style>

 Let me know if this helps.

Best wishes,
Katerina
the Telerik team

[Sreenivas]

Hi Katerina,
Thanks for your quick response. This works as expected. Appriciate your time.

Thanks
Sreenivas.