A Pen by Dinesh Vasudevan.

A-Pen-by-Dinesh-Vasudevan.markdown

Progress Back with varible no of pages

A Pen by Dinesh Vasudevan on CodePen.

License.

index.html

Test
<div class="progress">
  <div class="nav left"><a href="#"></a></div>
  <div class="page"><a href="#"></a></div>
  <div class="page"><a href="#"></a></div>
  <div class="page"><a href="#"></a></div>
  <div class="page"><a href="#"></a></div>
  <div class="page"><a href="#"></a></div>
  <div class="page"><a href="#"></a></div>
  <div class="page"><a href="#"></a></div>
  <div class="page"><a href="#"></a></div>
  <div class="nav right"><a href="#"></a></div>
</div>

style.less

.progress {
  width: 100%;
  background-color: grey;
  height: 40px;
  display: table;
  
  .page, .nav {
    display: table-cell; 
    padding: 5px;
  }
  
  .nav {
    width: 20px;
  }
  
  .page {
    a {
      background-color: blue;
      margin: 1%;
      display: block;
      height: 100%;
      width: 100%;
    }
  }
}