I'm using it in this content, where `.trailer__wrap` takes up the full length of the parent element, and `.trailer` element get's vertically aligned center:

Vertically Center Extendable

%vertically-centered-child {
  font-size: 0;
  text-align: center;

  &:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
  }

  > * {
    display: inline-block;
    font-size: $base-font-size;
    vertical-align: middle;
  }
}

/* Usage:
    
    .trailer__wrap {
        @extend %vertically-centered-child;
        bottom: 0;
        left: 0;
        position: absolute;
        right: 0;
        top: 0;
    }

    .trailer {
        // Whatever element that I want to be vertically aligned.
    }
    
*/