Pagination

Styles of paginations in tables and panels.

Tables/pages

Pagination beneath a table.

<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.

<!--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>