CSS center horizontally + vertically undefined height

CSS-center-horizontally-vertically.css

// Translate mixin
// ------------------------------
.translate(@x; @y) {
  -webkit-transform: translate(@x, @y);
      -ms-transform: translate(@x, @y); 
       -o-transform: translate(@x, @y);
          transform: translate(@x, @y);
}

// Center-align mixin
// ------------------------------

// Center full
.center-full() {
  position: absolute;
  top: 50%; 
  left: 50%;
  .translate(-50%, -50%);
}
 
// Center top only
.center-top() {
  position: absolute;
  top: 50%; 
  .translate(0, -50%);
}
 
// Block element
// ------------------------------

.box {
  .center-full();
  color: #222;
  height: 50%;
  width: 50%;
  
  p {
    .center-top();
  }
}