csssassincludescss-mixinsscss-lint

Prefixer mixin for adding vendor prefixes to CSS properties


why the Webkit and Moz not including in output in css file ?

the scss mixin

@mixin prefixer($property, $value, $prefixes: ()) {
  @each $prefix in $prefixes {
    #{"-" + $prefix + "-" + $property}: $value;
  }
  #{$property}: $value;
}

including

*{
   @include prefixer(box-sizing,border-box,("webkit","moz","o","ms"));
}

css output

* {
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

Solution

  • Without more information on your project, I will make a guess. You most probably have Autoprefixer running with the tool you're using to compile your SCSS.

    [Autoprefixer is a] plugin to parse CSS and add vendor prefixes to CSS rules using values from Can I Use.

    It uses the Browserslist you have configured to add or remove the vendor prefixes to the rules.

    Your mixin is not necessary.