Generated by SassMeister.com.

SassMeister-input-HTML.html

<div></div>

SassMeister-input.scss

// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----

$s-font-base: 16px;

@function strip-unit($value) {
    @return $value / ($value * 0 + 1);
}

@function isRelative($val) {
  $relUnits: rem em;
  @each $unit in $relUnits {
    @if $unit == unit($val) {
      @return true;
    }
  }
  @return false;
}

@function px2rel($px, $baseSize: $s-font-base, $unit: rem) {
    $return: null;
    @each $val in $px {
      @if type-of($val) == number and unit($val) == 'px' {
        $return: append($return, ( $val / $baseSize ) * 1#{$unit});
      } @else {
        $return: append($return, $val);
      }
    }
    @return $return;
}

@function rel2px($rel, $baseSize: $s-font-base) {
  $return: null;
    @each $val in $rel {
      @if type-of($val) == number and isRelative($val) {
        $return: append($return, strip-unit($val) * strip-unit($baseSize) + px);
      } @else {
        $return: append($return, $val);
      }
    }
    @return $return;
}

@mixin remFallback($attr,$vals) {
  $values: px2rel($vals);
  $fallback: rel2px($vals);

  @if $fallback != $values {
    #{$attr}: $fallback;
  }
  #{$attr}: $values;
}

.test {
  @include remFallback(padding, 10px 0);
  margin: px2rel(2px 10px 0 20%);
}

.test-2 {
  @include remFallback(margin, 10px 20% 20em);
}
.test-3 {
  @include remFallback(border, 10px solid red);
}
.test-4 {
  @include remFallback(top, 2rem);
}
.test-5 {
  @include remFallback(border-width, 2rem 10px 3em 7%);
}
.test-5 {
  @include remFallback(border-radius, 1rem 0 1.5rem 50%);
}
.test-6 {
  @include remFallback(left, 10%);
}

SassMeister-output.css

.test {
  padding: 10px 0;
  padding: 0.625rem 0;
  margin: 0.125rem 0.625rem 0 20%;
}

.test-2 {
  margin: 10px 20% 320px;
  margin: 0.625rem 20% 20em;
}

.test-3 {
  border: 10px solid red;
  border: 0.625rem solid red;
}

.test-4 {
  top: 32px;
  top: 2rem;
}

.test-5 {
  border-width: 32px 10px 48px 7%;
  border-width: 2rem 0.625rem 3em 7%;
}

.test-5 {
  border-radius: 16px 0 24px 50%;
  border-radius: 1rem 0 1.5rem 50%;
}

.test-6 {
  left: 10%;
}

SassMeister-rendered.html

<div></div>