Search code examples
asp.netasp.net-mvcasp.net-mvc-3asp.net-mvc-4webgrid

WebGrid pager styling


Is there any way to apply styling to the WebGrid Pager?

The only way I've found to do this is from client side by writing Jquery code, but it seems a little bit dirty.

Is there any normal way to provide css for this GridHelper?


Solution

  • You can use CSS as normal for styling links in a pager. You just need to ensure that you can identify the links via a CSS selector. If you place you Pager call in an identifiable element, this is quite easy:

    <div id="pager">
        @grid.Pager()
    </div>
    

    Now you can access the links for styling:

    #pager a {
        color: pink;
        text-decoration: none;
    }
    #pager a:hover {
        color: green;
        text-decoration: underline;
    }