> For the complete documentation index, see [llms.txt](https://dev.xena.biz/xena-developer/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://dev.xena.biz/xena-developer/user-interface/styleguide/pagination.md).

# Pagination

## Tables/pages

![Pagination beneath a table.](/files/-LZoPOEAHdVgAJBXs9-q)

```markup
<div class="table-footer">
    <ul class="pagination">
        <li><a href="#" title="First"><i class="fas fa-angle-left"></i></a></li>
        <li><a href="#" title="Previous"><i class="fas fa-angle-double-left"></i></a></li>
        <li class="pagination-select">Page <select class="paging-select"><option>1</option> ... </select> of 5</li>
        <li><a href="#" title="Next"><i class="fas fa-angle-double-right"></i></a></li>
        <li><a href="#" title="Last"><i class="fas fa-angle-right"></i></a></li>
    </ul>
</div>
```

## Panels

![Pagination in a panel.](/files/-LZoPOEDFM3jTgU4Fiwk)

```markup
<!--Between panel-heading and panel-body-->
<ul class="panel-pagination">
    <li>
        <a href="#" title="First"><i class="fas fa-angle-left"></i></a>
        <a href="#" title="Previous"><i class="fas fa-angle-double-left"></i></a>
    </li>
    <li class="pagination-select">Page <select class="paging-select"><option>1</option> ... </select> of 5</li>
    <li>
        <a href="#" title="Next"><i class="fas fa-angle-double-right"></i></a>
        <a href="#" title="Last"><i class="fas fa-angle-right"></i></a>
    </li>
</ul>
```