how to flip glyphicon icon
Is there any way to flip glyphicon. I found Flip an Image css trick, but that does not work for glyphicon. Please any suggestions
Like this
HTML
<a href="#" class="btn"><i class="icon-rotate icon-flipped"></i></a>
CSS
.icon-flipped {
transform: scaleX(-1);
-moz-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
-ms-transform: scaleX(-1);
}
OR
http://fortawesome.github.io/Font-Awesome/examples/#rotated-flipped
Using glyphicons managed to make this work like so:
HTML
<span class="glyphicon glyphicon-search" id="my-glyphicon"></span>
CSS
#my-glyphicon {
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
filter: FlipH;
-ms-filter: "FlipH";
}
see JSFiddle here