Bootstrap 5 pagination

Loading…

Bootstrap 5 pagination | GoSnippets

Source Code

1<div class="page-content page-container" id="page-content">
2    <div class="padding">
3        <div class="row container d-flex justify-content-center">
4            <div class="col-md-4 col-sm-6 grid-margin stretch-card">
5                <div class="card">
6                    <div class="card-body">
7                        <h4 class="card-title">Flat Pagination</h4>
8                        <p class="card-description">Flat pagination Example</p>
9                        <nav>
10                            <ul class="pagination d-flex justify-content-center flex-wrap pagination-flat pagination-success">
11                                <li class="page-item"><a class="page-link" href="#" data-abc="true"><i class="fa fa-angle-left"></i></a></li>
12                                <li class="page-item active"><a class="page-link" href="#" data-abc="true">1</a></li>
13                                <li class="page-item"><a class="page-link" href="#" data-abc="true">2</a></li>
14                                <li class="page-item"><a class="page-link" href="#" data-abc="true">3</a></li>
15                                <li class="page-item"><a class="page-link" href="#" data-abc="true">4</a></li>
16                                <li class="page-item"><a class="page-link" href="#" data-abc="true"><i class="fa fa-angle-right"></i></a></li>
17                            </ul>
18                        </nav>
19                    </div>
20                </div>
21            </div>
22        </div>
23    </div>
24</div>

Bootstrap 5 pagination

Source Code

More Utilities snippets

Comments(0)

Working in Tailwind? Explore our Tailwind gallery