translate()

.center {
  position: absolute;
  left: 50%;
  top: 50%;
  
  /*
  Nope =(
  margin-left: -25%;
  margin-top: -25%;
  */

  /* 
  Yep!
  */
  transform: translate(-50%, -50%);
  
  /*
  Not even necessary really. 
  e.g. Height could be left out!
  */
  width: 40%;
  height: 50%;
}

position:absolute;
left: 30%;
right:30%;
top: 25%;
bottom:25%;


position: absolute;
top: 0;
right: 0;
bottom: 0;
left:  0;
margin: auto;
width: 40%;
height: 50%;


position:absolute;
left: 30%;
right:30%;
top: 25%;
bottom:25%;