Sass mixin for background transparency back to IE8

@mixin transparent($color, $alpha) {
  $rgba: rgba($color, $alpha);
  $ie-hex-str: ie-hex-str($rgba);
  background-color: transparent;
  background-color: $rgba;
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#{$ie-hex-str},endColorstr=#{$ie-hex-str});
  zoom: 1;
}

NOTE: The ie-hex-str is only available in recent versions, not sure when it was introduced though


I think I encountered a similar problem when I wanted to pass a url to the mixin. Instead of sending only the url I had the send the whole url parameter as a parameter to the mixin. If you understand what I mean?

example:

@mixin bg($url)
  background: #000 $url repeat-x

insted of:

@mixin bg($url)
  background: #000 url($url) repeat-x

Also, this might not the suited for your application, but I usually work around that problem using opacity:

@mixin transparent_bg($hex, $a){
  /* for IEGR8 */
  filter:alpha(opacity=$a)
  zoom: 1;

  /* for modern browsers */
  background-color: $hex;
  opacity: ($a*10)
}