Menu

Component: Pagination

Basic pagination

<nav arial-label="pagination">
  <ol class="nav-pagination mb-3">
    <li aria-current="page"><a href="#">5</a></li>
    <li><a href="#">6</a></li>
    <li><a href="#">7</a></li>
    <li><a href="#">last page</a></li>
  </ol>
</nav>

Pagination alignment

To change the alignment of the pagination you have to add a text-left, text-center or text-right on <nav>

<nav arial-label="pagination" class="text-center">...</nav>

Pagination with icons

<nav arial-label="pagination">
  <ol class="nav-pagination mb-3">
    <li><a href="#"><i class="fas fa-chevron-left"></i></a></li>
    <li><a href="#">5</a></li>
    <li aria-current="page"><a href="#">6</a></li>
    <li><a href="#">7</a></li>
    <li><a href="#"><i class="fas fa-chevron-right"></i></a></li>
  </ol>
</nav>