Pager

Quick previous and next links for simple pagination implementations with light markup and styles. It's great for simple sites like blogs or magazines.

Default example

By default, the pager centers links.

<ul class="pager">
  <li><a href="#">Previous</a></li>
  <li><a href="#">Next</a></li>
</ul>

Aligned links

Alternatively, you can align each link to the sides:

<ul class="pager">
  <li class="previous">
    <a href="#">&larr; Older</a>
  </li>
  <li class="next">
    <a href="#">Newer &rarr;</a>
  </li>
</ul>

Optional disabled state

Pager links also use the general .disabled utility class from the pagination.

<ul class="pager">
  <li class="previous disabled">
    <a href="#">&larr; Older</a>
  </li>
  ...
</ul>