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>
Last modified 1yr ago
Copy link