fixing flipped icons in ie8

css/font-awesome.css

@@ -170,6 +170,7 @@
   transform: rotate(270deg);
 }
 .fa-flip-horizontal {
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
   -webkit-transform: scale(-1, 1);
   -moz-transform: scale(-1, 1);
   -ms-transform: scale(-1, 1);
@@ -177,6 +178,7 @@
   transform: scale(-1, 1);
 }
 .fa-flip-vertical {
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
   -webkit-transform: scale(1, -1);
   -moz-transform: scale(1, -1);
   -ms-transform: scale(1, -1);

css/font-awesome.min.css

@@ -16,8 +16,8 @@
 @-moz-keyframes spin{0%{-moz-transform:rotate(0deg)} 100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)} 100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)} 100%{-o-transform:rotate(359deg)}}@-ms-keyframes spin{0%{-ms-transform:rotate(0deg)} 100%{-ms-transform:rotate(359deg)}}@keyframes spin{0%{transform:rotate(0deg)} 100%{transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)}
 .fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}
 .fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg)}
-.fa-flip-horizontal{-webkit-transform:scale(-1, 1);-moz-transform:scale(-1, 1);-ms-transform:scale(-1, 1);-o-transform:scale(-1, 1);transform:scale(-1, 1)}
-.fa-flip-vertical{-webkit-transform:scale(1, -1);-moz-transform:scale(1, -1);-ms-transform:scale(1, -1);-o-transform:scale(1, -1);transform:scale(1, -1)}
+.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-moz-transform:scale(-1, 1);-ms-transform:scale(-1, 1);-o-transform:scale(-1, 1);transform:scale(-1, 1)}
+.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-moz-transform:scale(1, -1);-ms-transform:scale(1, -1);-o-transform:scale(1, -1);transform:scale(1, -1)}
 .fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}
 .fa-stack-top,.fa-stack-bottom{position:absolute;width:100%;text-align:center}
 .fa-stack-top{line-height:inherit}

less/mixins.less

@@ -10,7 +10,8 @@
           transform: rotate(@degrees);
 }
 
-.fa-icon-flip(@horiz, @vert) {
+.fa-icon-flip(@horiz, @vert, @rotation) {
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=@rotation, mirror=1);
   -webkit-transform: scale(@horiz, @vert);
      -moz-transform: scale(@horiz, @vert);
       -ms-transform: scale(@horiz, @vert);

less/rotated-flipped.less

@@ -5,5 +5,5 @@
 .@{fa-css-prefix}-rotate-180 { .fa-icon-rotate(180deg, 2); }
 .@{fa-css-prefix}-rotate-270 { .fa-icon-rotate(270deg, 3); }
 
-.@{fa-css-prefix}-flip-horizontal { .fa-icon-flip(-1, 1); }
-.@{fa-css-prefix}-flip-vertical   { .fa-icon-flip(1, -1); }
+.@{fa-css-prefix}-flip-horizontal { .fa-icon-flip(-1, 1, 0); }
+.@{fa-css-prefix}-flip-vertical   { .fa-icon-flip(1, -1, 2); }

src/assets/font-awesome/less/mixins.less

@@ -12,7 +12,8 @@
           transform: rotate(@degrees);
 }
 
-.fa-icon-flip(@horiz, @vert) {
+.fa-icon-flip(@horiz, @vert, @rotation) {
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=@rotation, mirror=1);
   -webkit-transform: scale(@horiz, @vert);
      -moz-transform: scale(@horiz, @vert);
       -ms-transform: scale(@horiz, @vert);

src/assets/font-awesome/less/rotated-flipped.less

@@ -8,5 +8,5 @@
 .@{fa-css-prefix}-rotate-180 { .fa-icon-rotate(180deg, 2); }
 .@{fa-css-prefix}-rotate-270 { .fa-icon-rotate(270deg, 3); }
 
-.@{fa-css-prefix}-flip-horizontal { .fa-icon-flip(-1, 1); }
-.@{fa-css-prefix}-flip-vertical   { .fa-icon-flip(1, -1); }
+.@{fa-css-prefix}-flip-horizontal { .fa-icon-flip(-1, 1, 0); }
+.@{fa-css-prefix}-flip-vertical   { .fa-icon-flip(1, -1, 2); }