Active Pagination using CSS

  • Post category:CSS

Get the code of Active Pagination using CSS and watch video tutorials. You can practice using our code editor. Our practical guide will make your learning journey much easier. You can explore the tutorial and learn.

<ul class="pagination">
  <li><a href="#">«</a></li>
  <li><a href="#">1</a></li>
  <li><a href="#">2</a></li>
  <li><a href="#" class="active">3</a></li>
  <li><a href="#" >»</a></li>
</ul>
.pagination {
  display: flex;
  justify-content: center;
  list-style-type: none;
  padding: 0;
}
.pagination li a {
  padding: 5px 10px;
  border: 1px solid gray;
  margin: 5px;
  border-radius: 5px; 
  text-decoration: none;
}
.pagination li a.active {
  background: green;
  color: white;
}