how to set position button to bottom?

can we change the position of circle buttons or pager button (which is on centre ) on my demo having red border but I need it on bottom right as show in image enter image description here .Given image have dots on bottom right .

can we change the position of circle button on bottom right .

here is my code http://plnkr.co/edit/Ny3wPlMG5F1ZbBtachdN?p=preview

#slideTest{
      margin-top:1em;
      border:1px solid pink;
      width:200px;
      height:100px;
    }
    .slider-pager{
      border:1px solid red;

    }

Check this out :

http://plnkr.co/edit/Sorz9aW43nAkfvALVMoc?p=preview

.slider-pager {
position: absolute;
bottom: 0px;
z-index: 1;
height: 15px;
text-align: right;
right: 0px;
width: auto;
}

Your wording is a little unclear, but I assume you mean something along these lines:

#slideTest{
  margin-top:1em;
  border:1px solid pink;
  width:200px;
  height:100px;
}
.slider-pager{
  border:1px solid red;
  position:absolute; 
  right:0; /* Move element to the right. */ 
  bottom:0; /* Move element to the bottom. */
}

Just make it position absolute and right to 0, bottom 0.

Here is code for slider-pager class

.slider-pager{
  border:1px solid red;
  position:absolute;
  right:0;
  bottom:0;
}

hi you just need only change in this class and just need to add two properties though answer is given but i want to add this..

.slider-pager{
      border:1px solid red;
      bottom: 0px;
      text-align: right;
    }

check after applying it will work for you

no need to apply too much properties for what you want to achieve.

position: absolute;
bottom: 0px; // include only this
z-index: 1;
height: 15px;
text-align: right; //include only this
right: 0px;
width: auto;