Pagination

Summary

The pagination pattern defines how content should be divided over multiple pages.

There are no attributes defined for this pattern.

Example

1 - 50 of 50

Markup

<div class="zui-pagination">
    <div class="zui-pagination-primary">
        <a href="#" class="disabled">Previous</a>
        <a href="#">1</a>
        <a href="#">2</a>
        <a href="#" class="selected">3</a>
        <a href="#">4</a>
        <a href="#">5</a>
        <a href="#">Next</a>
    </div>
    <div class="zui-pagination-secondary">
        <span class="zui-pagination-count">
            <span class="zui-pagination-from">1</span>
            -
            <span class="zui-pagination-till">50</span>
            of
            <span class="zui-pagination-total">50</span>
        </span>
        <a href="#"><i class="zui-icon zui-icon-refresh"></i></a>
    </div>
</div>
Fork me on GitHub