Centering the unknown

_center-vertical.scss

// Center a block element width unknown
// height and width horizontally and vertically
// If it doesn't center vertically, play with the spacing.
// <div class="parent">
//    <div class="child">....</div>
// </div>
//
// .parent {
//     ... your styles here....
//     text-align:center; // if you need horizontally spacing
//     @include center-vertical;
// }
//
// .child {
//     .... your styles here
// }
@mixin center-vertical($spacing: -0.25em) {
    &:before {
        content: '';
        display: inline-block;
        height: 100%;
        vertical-align: middle;
        margin-right: $spacing;
    }

    > * {
        display: inline-block;
        vertical-align: middle;
    }
}