RadDataPager Alignment

5 posts, 0 answers
  1. Jeff Gorman
    Jeff Gorman avatar
    4 posts
    Member since:
    May 2010

    Posted 31 May 2010 Link to this post

    i'm not sure if I'm missing something here or not, but how do I center a RadDataPager???  It seems to always want to align to the left.  Below is the RadDataPager code I'm using.


            <center> 
                <telerik:RadDataPager EnableEmbeddedBaseStylesheet="False" ID="RadDataPager2" runat="server"  
                    PagedControlID="RadListView1"
                    <Fields> 
                        <telerik:RadDataPagerButtonField FieldType="FirstPrev" /> 
                        <telerik:RadDataPagerButtonField FieldType="Numeric" /> 
                        <telerik:RadDataPagerButtonField FieldType="NextLast" /> 
                    </Fields> 
                </telerik:RadDataPager> 
            </center> 
     

  2. Rosen
    Admin
    Rosen avatar
    3241 posts

    Posted 01 Jun 2010 Link to this post

    Hello Jeff,

    As you may know paging elements of RadDataPager have float:left set by default. Therefore in order to "push" them you should consider setting padding to the pager container element. Similar to the following:

    <style type="text/css">
         div.RadDataPager
         {
             padding-left:30%;
         
     </style>

    All the best,
    Rosen
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  3. Jeff Gorman
    Jeff Gorman avatar
    4 posts
    Member since:
    May 2010

    Posted 01 Jun 2010 Link to this post

    That would work if the DataPager was a fixed width, but the width varies based on the number of pages.
  4. BaiH
    BaiH avatar
    83 posts
    Member since:
    Aug 2008

    Posted 03 Jun 2010 Link to this post

    I'm using similar approach too. I have just modified the padding value according to the layout.
    I don't think currently there is another solution... maybe a custom skin. If you find one please post it here.

    --BH

  5. Nicolas Fahr
    Nicolas Fahr avatar
    13 posts
    Member since:
    Dec 2008

    Posted 22 Mar 2012 Link to this post

    this might be anothersolution:

    div.RadDataPager
    {
        float: left;
        left: 50%;
        position: relative;
        background: none;
        border: 0px solid #888;
    }
    div.RadDataPager .rdpWrap
    {
        right: 50%;
        position: relative;
        background-color: yellow;
        height: 30px;
    }
    div.RadDataPager .rdpWrap input, div.RadDataPager .rdpWrap a
    {
        margin-top: 4px !important;
    }
Back to Top