JSFiddle - React, Tailwind, and code Playground

by ben74

HTML

<a href='http://google.fr/#'>
    <img src='http://www.alsacreations.com/css/img/picto-aide.png'>
    </a>
<b>Already transparent</b>

CSS

body{background:#888}
img{width:auto:height:auto;border:1px solid #F07;vertical-align:middle;
    background: transparent;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);   /* IE6 & 7 */     
    zoom: 1;

}
b,a{color:#F07}
a:hover img{background-color:#FFF;}
a:hover,b{opacity: 0.5;filter:alpha(opacity=50);ms-filter:alpha(opacity=50);zoom:1;
    /*ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";*/
    
}
a{border:1px dashed #080;width:300px;line-height:300px;
    text-align:center;display:block;
}