We Recommend

CSS: The Definitive Guide CSS: The Definitive Guide
Provides you with a comprehensive guide to CSS implementation, along with a thorough review of all aspects of CSS 2.1. Updated to cover Internet Explorer 7, Microsoft's vastly improved browser, this new edition includes content on positioning, text wrapping (nowrap), lists and generated content, table layout, user interface, paged media, and more.


Posted By

webDesign on 08/03/06


Tagged

css pagination


Versions (?)


Who likes this?

8 people have marked this snippet as a favorite

xaviaracil
Navegante
meth
inakiabt
Hirmine
tavo
vali29
monapdx


Enlaces de paginación / Pagination links


Published in: CSS 


  1. ***** CSS *****
  2. .paginacion{margin:0 20px 20px 0; padding:2px}
  3. .paginacion ul{margin:0; padding:0; text-align:right; font-size:16px}
  4. .paginacion li{list-style-type:none; display:inline; padding-bottom:1px}
  5. .paginacion a, .paginacion a:visited{padding:0 5px; border:1px solid #9C3D3D; text-decoration:none; color:#000}
  6. .paginacion a:hover, .paginacion a:active{border:1px solid #9C3D3D; color:#9C3D3D; background:#EFEFEF}
  7. .paginacion a.paginaActual{background:#9C3D3D; color:#FFF !important; border-color:#9C3D3D; font-weight:700; cursor:default}
  8. .paginacion a.deshabilitado, .paginacion a.deshabilitado:hover{background:#FFF; cursor:default; color:#929292; border-color:#929292; font-weight:400 !important}
  9. .paginacion a.anteriorSiguiente{font-weight:700}
  10.  
  11. ***** HTML *****
  12. <div class="paginacion">
  13. <ul>
  14. <li><a href="#" class="anteriorSiguiente deshabilitado">« anterior</a></li>
  15. <li><a href="#" class="paginaActual">1</a></li>
  16. <li><a href="#">2</a></li>
  17. <li><a href="#">3</a></li>
  18. <li><a href="#">4</a></li>
  19. <li><a href="#">5</a>...</li>
  20. <li><a href="#">9</a></li>
  21. <li><a href="#">10</a></li>
  22. <li><a href="#" class="anteriorSiguiente">siguiente »</a></li>
  23. </ul>
  24. </div>

Report this snippet 

Comments

RSS Icon Subscribe to comments
Posted By: imbuez on August 20, 2006

Sorry to be a bore but this code is very much broken in IE ;)

You need to login to post a comment.