Skip to content

Instantly share code, notes, and snippets.

@astockwell
Created November 27, 2012 22:28
Show Gist options
  • Save astockwell/4157590 to your computer and use it in GitHub Desktop.
Save astockwell/4157590 to your computer and use it in GitHub Desktop.
SASS Mixin: Background color alpha compatible with IE 6-9
@import "compass/css3/images";
// Partially via http://www.colorzilla.com/gradient-editor/
@mixin nav-child-bg-color-alpha($color, $alpha: 0.5) {
background: url(screen.css); // Point to this css file. Fix for IE "No Transparency Click" bug on <a> elements w/ bg transparency. Via http://haslayout.net/css/No-Transparency-Click-Bug
@include background-image(linear-gradient(top, rgba($color, $alpha) 0%,rgba($color, $alpha) 100%));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#{ie-hex-str(rgba($color, $alpha))}', endColorstr='#{ie-hex-str(rgba($color, $alpha))}',GradientType=0 ); /* IE6-9 */
}
// USEAGE:
// @include nav-child-bg-color-alpha($orange);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment