Browser Hack Mixins for Sass

Apply your CSS to a specific browser

Requirements

• Sass 3.3+

How To Use

1. Import _hacks.scss file to your SCSS code : @import "hacks";
2. Use the mixin you want:
   • @include [Mixin_Name]( 'selector', (property: value) )
   • For example:

     @include only_ie9( '.my_element', (color: red))

     Or:

     @include only_ff28_above( '.my_element', (
     background-color: green,
     display: flex,
     margin: 2em,
     ))

List of Mixins

1. Firefox CSS Hacks
   • only_ff
   • only_ff2
   • only_ff2_above
   • only_ff3_above
   • only_ff6_above
   • only_ff16_above
   • only_ff21_above
   • only_ff24_above
   • only_ff25_above
   • only_ff26_above
   • only_ff27_above
   • only_ff28_above
   • only_ff30_above
2. Webkit CSS Hacks
   • only_webkit
   • only_chrome
   • only_safari
   • only_safari9
   • only_ios
   • only_safari_no_ios
   • only_opera9_safari2
3. Opera CSS Hacks
   • only_opera
   • only_opera11
4. Internet Explorer CSS Hacks
   • only_edge
   • only_ie6
   • only_ie7
   • only_ie7_below
   • only_ie8
   • only_ie8_below
   • only_ie9
   • only_ie9_below
   • only_ie10_above
   • only_ie11
   • only_ie11_above
   • no_ie6
   • only_ie9_saf4_above
5. Other CSS Hacks
   • no_ie_safari6