Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS What is the easiest way to deal with vendor prefixes with SASS/Compass? Reply To: What is the easiest way to deal with vendor prefixes with SASS/Compass?

#155666
__
Participant

have a look at the docs.

You could certainly make your own mixin that accepts the property name as an arg. In fact, that’s what Bourbon does:

// generic "prefixer" mixin:

$prefix-for-webkit: true !default
$prefix-for-mozilla: true !default
$prefix-for-microsoft: true !default
$prefix-for-opera: true !default
$prefix-for-spec: true !default

=prefixer($property, $value, $prefixes)
  @each $prefix in $prefixes
    @if $prefix == webkit
      @if $prefix-for-webkit
        -webkit-#{$property}: $value
    @else if $prefix == moz
      @if $prefix-for-mozilla
        -moz-#{$property}: $value
    @else if $prefix == ms
      @if $prefix-for-microsoft
        -ms-#{$property}: $value
    @else if $prefix == o
      @if $prefix-for-opera
        -o-#{$property}: $value
    @else if $prefix == spec
      @if $prefix-for-spec
        #{$property}: $value
    @else
      @warn "Unrecognized prefix: #{$prefix}"