scss MX-VerticalAlign

Posted 2021-05-17

<div>
  <span class="valign">Some text</span>
</div>



@mixin vertical-align {
    position: relative;
    top: 40%;
    -webkit-transform: translateY(-40%);
    -ms-transform: translateY(-40%);
    transform: translateY(-40%);
}

div {
  background: tomato;
  width: 600px;
  height: 300px;
  text-align: center;
}

.valign {
  @include vertical-align();
}