Skip to content

Instantly share code, notes, and snippets.

@berend-de-jong

berend-de-jong/CSS: opacity.css

Last active December 14, 2015 19:59
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save berend-de-jong/5140930 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save berend-de-jong/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;
@berend-de-jong
Copy link
Author

berend-de-jong commented Mar 12, 2013

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

@berend-de-jong
Copy link
Author

berend-de-jong 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