Place button on bottom of div or screen

just do the button position:absolute without putting the div relativ

.button {
    position: absolute;
    bottom: 10px;
    left: 50%;
    margin-left: -104.5px; /*104.5px is half of the button's width*/
}
.test{
  height:1000px;
  
}
<div class="test">
 <div>
    <div>
      <button class="button">
            test
      </button>
    </div>
  </div>
</div>


if width div 50% then left must 25% if width div 70% then left must 15%

.center{
  position:fixed;
  bottom:20px;
  left:20%;
  width:60%;
 
}

 .center .btn{
     background:red;
     width:100%;
     color:white;
     font-weight:bold;
     border-radius: 64px;
    padding:10px;
  }
<div class="center">
  <button class="btn">Login</button>
</div>

Tags:

Html

Css