[Solved] Chrome Rendering RadToolbar Items in a different spot depending on scroll position

[James Diorio]

Hello Community,

I'm having an issue with the RadToolBar and Chrome 5.0.375.99. I have checkboxes in the toolbar as tb items and when you expand the toolbar on first page load with page scrolled to the top it works fine. However, if you vertically scroll down on the page and then expand the toolbar the checkboxes appear floating near the top of the page. Using chrome developer tools I was able to see the "top" property changes based on where you're vertically scrolled to on the page.

I also noticed that the div for the toolbar renders at the top of the page right below the form tag in Chrome only.

The code snippet below is my Toolbar code.

<tr>
<td>
<telerik:RadToolBar ID="radTbSubscription" runat="server" BackColor="#375681" Skin="Default"
EnableViewState="false" ExpandAnimation-Type="OutQuart"
CollapseAnimation-Type="InQuart" EnableAjaxSkinRendering="False">
<CollapseAnimation Type="InQuart" />
<Items>
<telerik:RadToolBarDropDown runat="server" Text="Select Topics">
<Buttons>
<telerik:RadToolBarButton runat="server" Text="rtbCreditReporting">
<ItemTemplate>
<asp:CheckBox runat="server" ID="chkCreditReporting" Text="Credit Reporting" />
</ItemTemplate>
</telerik:RadToolBarButton>
<telerik:RadToolBarButton Text="rtbDebtCollection">
<ItemTemplate>
<asp:CheckBox runat="server" ID="chkDebtCollection" Text="Debt Collection" />
</ItemTemplate>
</telerik:RadToolBarButton>
<telerik:RadToolBarButton runat="server" Text="rtbConsumerIssues">
<ItemTemplate>
<asp:CheckBox runat="server" ID="chkConsumerIssues" Text="Consumer Issues" Width="125px" />
</ItemTemplate>
</telerik:RadToolBarButton>
<telerik:RadToolBarButton runat="server" Text="rtbBankruptcy">
<ItemTemplate>
<asp:CheckBox runat="server" ID="chkBankruptcy" Text="Bankruptcy" />
</ItemTemplate>
</telerik:RadToolBarButton>
</Buttons>
</telerik:RadToolBarDropDown>
</Items>
</telerik:RadToolBar>
</td>
</tr>

Any help is appreciated.

[Yana]

Hi James,

I'm pasting here the reply from the support ticket  with the same question.

I tried to reproduce this issue but to no avail. I guess that the toolbar is placed in a relatively or absolutely positioned container. Could you please send us a runnable page demonstrating the issue so that we can test it? Thanks in advance

Greetings,
Yana
the Telerik team