Rotation property not working in IE8

Question

I need to rotate a div element in IE8 browser.

I have rendered the arrow (with two div elements)

<DIV class=e-arrowTip> 
 <DIV class=e-arrowTipOuter></DIV>
 <DIV class=e-arrowTipInner></DIV>
</DIV>

.e-arrowTip{
    bottom: -1px;
    height: 10px;
    position: absolute;
    transform: rotate(90deg);
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
    filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
    left: 50%;
    top: 100%;
    overflow: hidden;
    visibility: visible;
    width: 20px;
}

In IE8, the div element not rotated.

I forget to say one thing, I am applying the styles through the scripting $(.e-arrowTip).css({"-ms-filter" : "progid:DXImageTransform.Microsoft.BasicImage(rotation=0)"}) — Kalai, Jul 11 '16 at 06:59

score 0 · Answer 1 · edited May 23 '17 at 11:53

0

Add the following to .e-arrowTip:

-ms-transform: rotate(90deg);

UPDATE:

Change .css({"-ms-filter" : to .css({"msFilter" :

Credit: https://stackoverflow.com/a/5594170/704808

edited May 23 '17 at 11:53

Community

1
1

answered Jan 12 '17 at 19:15

weir

4,521
2
29
42

Rotation property not working in IE8

1 Answers1