Contents

// Vertically center anything, literally anything.
// http://zerosixthree.se/vertical-align-anything-with-just-3-lines-of-css/
@mixin vertical-center($midpoint: null, $extend: null) {
  $midpoint: if($midpoint != null, $midpoint, toolkit-get('vertical midpoint'));
  $extend: if($extend != null, $extend, toolkit-get('vertical extend'));

  top: $midpoint;
  @include vertical-center-core($extend);
}

@mixin vertical-center-core($extend: null) {
  $extend: if($extend != null, $extend, toolkit-get('vertical extend'));
  @if $extend {
    @include dynamic-extend('vertical center') {
      @include vertical-center-core($extend: false);
    }
  }
  @else {
    position: relative;
    @if mixin-exists(transform) {
      @include transform(translateY(-50%));
    } @else {
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
    }
  }
}

Version data entries

1 entries across 1 versions & 1 rubygems

Version	Path
toolkit-2.0.1	stylesheets/toolkit/_vertical-center.scss