Karatas, FERHAT
I would love to change the world, but they won't give me the source code!
ASP.NET GridView Paging Style
23.06.2009 10:05:07 - Filed under : Asp.net | CSS
Tip 1: Change the style of the selected page or highlight the current page in the GridView Pager control
A simple way is to use CSS as shown below. The <PagerStyle> is set to a css class which modifies the style of the pager:
<head runat="server">
    <title></title>
       <style type="text/css">   
              .cssPager span { background-color:#4f6b72; font-size:18px;}    
        </style>
</head>
<asp:GridView ID="GridView1" runat="server" AllowPaging="true" AutoGenerateColumns="false" DataKeyNames="ProductID" DataSourceID="SqlDataSource1">
    <PagerStyle CssClass="cssPager" />
...
The output is as shown below, with the style set for the current page.


Tip 2: How to increase the spacing between the ASP.NET GridView Pager Numbers
One simple way is to use CSS again. Observe how we have set a cssClass to the PagerStyle, similar to what we saw in Tip 1, and are increasing the padding for the <td>:
<head runat="server">
    <title></title>
       <style type="text/css">            
            .cssPager td
            {
                  padding-left: 4px;     
                  padding-right: 4px;     
             }
        </style>
</head>
<asp:GridView ID="GridView1" runat="server" AllowPaging="true" AutoGenerateColumns="false" DataKeyNames="ProductID" DataSourceID="SqlDataSource1">
    <PagerStyle CssClass="cssPager" />
...
The output looks similar to the following with the increased space between the page number display.


Keywords : Some Tips and Tricks while Using ASP.NET GridView Paging
with 0 comments

What do you think ?
Security Code 4932
Check S. Code
Name  
Email  
Home Page  
Comments