RadToolTip border disappear when browser window resize

[Guillaume]

Hi,

I am having an issue with the RadToolTip when I resize my broser window and the width of the tooltip is not set. When I resize the browser, the border left and right disappear.

I have manage reproduce the problem in a blank page with the following code :

<telerik:RadScriptManager ID="RadScriptManager1" runat="server" EnablePartialRendering="True" LoadScriptsBeforeUI="True">
</telerik:RadScriptManager>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" UpdatePanelsRenderMode="Inline">
</telerik:RadAjaxManager>

<asp:Label ID="LabelForToolTipTest" runat="server" Text="Label avec Telerik ToolTip"></asp:Label>
<telerik:RadToolTip ID="RadToolTipForLabel" runat="server" TargetControlID="LabelForToolTipTest" Position="BottomRight" HideDelay="5000">
    <div style="width:500px"></div>
</telerik:RadToolTip>

 

If i set a width to the tooltip the problem is solved, but in my case this is not possible, because the content is always different. The same issue occurs with the RadToolTipManager.

Thank for your help,

Guillaume

[Guillaume]

I forgot to mention that the issue only occurs in IE9. I tried it in chrome and cannot reproduce the problem.

[Marin Bratanov]

Hi Guillaume,

For the tooltip to work as expected, it must have dimensions set: http://docs.telerik.com/devtools/aspnet-ajax/controls/tooltip/troubleshooting/common-issues#tooltip-is-not-positioned-correctly.

The tooltip control does not offer autosizing capabilities like RadWindow so it relies on the developer to provide dimensions that are enough to accommodate the content. If they are not, the browser would sometimes stretch its HTML elements in an unexpected way.

This is more pronounced in the Classic RenderMode as it uses tables for the layout. Thus, I can also suggest switching to the Lightweight RenderMode because its uses divs: http://docs.telerik.com/devtools/aspnet-ajax/controls/tooltip/mobile-support/render-modes.

Regards,

Marin Bratanov
Telerik