@Mixin code not getting vendor prefixes

The following is simplified, but roughly my code looks like this:

Current input:

#container {
  @include align-children;
}

@mixin align-children {
  & > * {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
  }
}

Current output:

#container > * {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

Am I doing something incorrectly here? I know that having the following:

#container {
  & > * {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
  }
}

works fine with Autoprefixer as the vendor prefixes are all there.

[eliasylee]

If Autoprefixer doesn’t work with @mixin and @include, this sounds perfectly like an Autoprefixer issue.

But regardless, I was under the impression that Sass pre-processes CSS files and removes at-rules before Autoprefixer comes in sees:

#container > * {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

Is this not the case?

[ai]

Just put PostCSS (Autoprefixer is PostCSS plugin) after Sass. In this case Autoprefixer will work with CSS.