Datapager Layout problems in Chrome and Safari

2 posts, 1 answers
  1. Jeff Clark
    Jeff Clark avatar
    15 posts
    Member since:
    Feb 2010

    Posted 25 Apr 2011 Link to this post

    I am using 2011 Q1 of ASP.NET Ajax tools. I have the following code within a RadListView control for data paging.

    <table cellpadding="0" cellspacing="0" width="100%;" style="clear: both;">
        <tr>
            <td>
                <telerik:RadDataPager ID="RadDataPager2" runat="server" PagedControlID="RadListView1"
                    PageSize="10">
                    <Fields>
                        <telerik:RadDataPagerButtonField FieldType="FirstPrev" />
                        <telerik:RadDataPagerButtonField FieldType="Numeric" />
                        <telerik:RadDataPagerButtonField FieldType="NextLast" />
                        <telerik:RadDataPagerPageSizeField PageSizeText="Page size: " />
                        <telerik:RadDataPagerGoToPageField CurrentPageText="Page: " TotalPageText="of" SubmitButtonText="Go"
                            TextBoxWidth="15" />
                        <telerik:RadDataPagerTemplatePageField>
                            <PagerTemplate>
                                <div style="float: right">
                                    <b>Items
                                        <asp:Label runat="server" ID="CurrentPageLabel" Text="<%# Container.Owner.StartRowIndex+1%>" />
                                        to
                                        <asp:Label runat="server" ID="TotalPagesLabel" Text="<%# Container.Owner.TotalRowCount > (Container.Owner.StartRowIndex+Container.Owner.PageSize) ? Container.Owner.StartRowIndex+Container.Owner.PageSize : Container.Owner.TotalRowCount %>" />
                                        of
                                        <asp:Label runat="server" ID="TotalItemsLabel" Text="<%# Container.Owner.TotalRowCount%>" />
                                        <br />
                                    </b>
                                </div>
                            </PagerTemplate>
                        </telerik:RadDataPagerTemplatePageField>
                    </Fields>
                </telerik:RadDataPager>
            </td>
        </tr>
    </table>

    The layout works fine in Internet Explorer (9) and Firefox (4) (see datapager ie.png image) but the page x of x section wraps in Chrome (10) and Safari (5) (see datapager chrome.png).

    Any ideas on how to fix this?

    Thank you.
  2. Answer
    Galin
    Admin
    Galin avatar
    526 posts

    Posted 27 Apr 2011 Link to this post

    Hi Jeff Clark,

    Resolve the issue with the following CSS:
    .rdpWrap .RadInput,
    .rdpWrap .rdpPagerButton,
    .rdpWrap .rdpPagerLabel
     {
         float: left;   
     }


    Kind regards,
    Galin
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top