Target browsers with css

_only-browser.scss

@mixin only-browser($browser) {

  // Firefox
  @if $browser == 'mozilla' or $browser == 'firefox' {
    @-moz-document url-prefix() {  @content; }
  }

  // IE
  @if $browser == 'ie' {
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  @content; }
  }

  // Edge
  @if $browser == 'edge' {
    @supports (-ms-ime-align: auto) { @content; }
  }

  // Safari 9+
  @if $browser == 'safari' {
    @supports (-webkit-marquee-repetition:infinite) and (object-fit:fill) { @content; }
  }

  // Google Chrome
  @if $browser == 'chrome' {
    @supports (-webkit-appearance:none) and (not (overflow:-webkit-marquee)) and (not (-ms-ime-align:auto)) and (not (-moz-appearance:none)) {  @content; }
  }
}