Create a gist now

Instantly share code, notes, and snippets.

Embed
Compass cross-browser RGBa background mixin
.blackAlpha50 {
*zoom: 1;
filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#80000000', endColorstr='#80000000');
background: transparent;
background: rgba(0, 0, 0, 0.5);
}
:root .blackAlpha50 {
filter: none\0/IE9;
}
// Provides cross-browser RGBa background.
// Takes a RABa color as the argument, e.g. rgba(0, 0, 0, 0.5) for black background with 50% opacity.
//
// @param $color
// A RGBa color
@mixin rgba-background($color){
@include filter-gradient($color, $color);
@if $legacy-support-for-ie6 or $legacy-support-for-ie7 or $legacy-support-for-ie8 {
background: transparent;
// set filter as none for IE9+, because IE9+ supprot RGBa
:root & {
filter: none\0/IE9;}
}
background: $color;
}
.blackAlpha50 {
@include rgba-background(rgba(0, 0, 0, .5));
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment