Augustana

Pagination

This is the pager used throughout the site. It appears on any listing page that has more than ten items. This particular example shows that the user is currently on page one of three pages.

1-10 of 38

skipback
directleft
1
2
3
directright
skipforward
 
<div class="pager">
  <p><small>1-10 of 38</small></p>
  <div class="pager-item is-disabled"><i class="ss-icon ss-standard">skipback</i></div>
  <div class="pager-item is-disabled"><i class="ss-icon ss-standard">directleft</i></div>
  <a href="#"><div class="pager-item is-active">1</div></a>
  <a href="#"><div class="pager-item">2</div></a>
  <a href="#"><div class="pager-item">3</div></a>
  <a href="#"><div class="pager-item"><i class="ss-icon ss-standard">directright</i></div></a>
  <a href="#"><div class="pager-item"><i class="ss-icon ss-standard">skipforward</i></div></a>
</div>