Hostgator coupons for up to 99% off hosting for Dynamic Drive visitors!
Advanced Search Usage Terms Submit Contact
Dynamic Drive CSS Library

CSS Library: Links & Buttons: Here

CSS Pagination Links

Author: Dynamic Drive

Updated: Aug 30th, 07. Fixed issue in IE7 where select links appear too close together.

Inspired by the pagination interface you see at the footer of, this is our version of a CSS pagination links bar, digg style. The links are list based for a cleaner and more semantically approach (in our opinion). The bar itself can easily be left or right aligned, by modifying the "text-align" attribute.


The CSS:


Code Info

Rate this code:

Date Posted: 08/30/2007

Revision History: Updated: 08/30/2007

Usage Terms: Click here

Your Comments (48)

Got a question or need help customizing this CSS code? Post it in the CSS Forums. If you have a comment or suggestion instead, post it in the comments section below.

Comment Pages 5 of 5 pages « First  <  3 4 5

How would one go about putting the entire pagination in 2 different areas of the same web page?
Posted by Jeff on 11/16, 12:17 PM
thanks. shall try it.
Posted by K.Ramachandran on 11/29, 09:55 PM
Buyu, Medyum, Medyumlar, Cinler, Buyuler, Nazar, Fallar, Yildizname, Hipnoz, Telepati, Reankarnasyon, Horoskop, Yorum, Tarot, Palmistry, Numeroloji, Konusunda Lider Site..!
Posted by buyu on 12/31, 08:22 AM
thanks people !!
Posted by satyam on 01/01, 02:54 PM
To centralize them replace:

.pagination ul{
margin: 0;
padding: 0;
text-align: left; /*Set to "right" to right align pagination interface*/
font-size: 16px;


.pagination ul{
margin: 0;
padding: 0;
text-align: center; /*Set to "right" to right align pagination interface*/
font-size: 16px;
Posted by Beyblade on 03/15, 10:27 AM
i want to use this pagination in my intranet application but i don;t know how we initialize the page from 1, ,2 ,3, so tell me.
Posted by Dhirendra kumar on 04/12, 11:21 PM
Very nice pagination CSS. Hope I can use it in my new project ;)
Posted by Shreemani on 05/03, 11:17 PM
thank you for the script.
Posted by onedelacrus on 06/08, 04:07 AM

Comment Pages 5 of 5 pages « First  <  3 4 5

Commenting is not available in this weblog entry.
Copyright 2006-2015 Dynamic Drive Read our Usage Terms before using any of the CSS codes.