Skip to content

Instantly share code, notes, and snippets.

@Frique

Frique/CSS: opacity.css

Last active December 14, 2015 19:59
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Frique/5140930 to your computer and use it in GitHub Desktop.
Save Frique/5140930 to your computer and use it in GitHub Desktop.
Download ZIP
CSS: opacity
Raw
CSS: opacity.css
zoom: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);
-moz-opacity: 0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
@Frique
Copy link
Author

Frique commented Mar 12, 2013

For IE, make sure the element has layout. Set a width / height or zoom: 1

@Frique
Copy link
Author

Frique commented May 29, 2013

As a sass mixin:

@mixin opacity($opacity){
    $opacity_ie: $opacity * 100;

    zoom: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=$opacity_ie)";
    filter: alpha(opacity=$opacity_ie);
    -moz-opacity: $opacity;
    -khtml-opacity: $opacity;
    opacity: $opacity;
}

@include opacity(0.5);

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment