0

Iam using svg in in a block level element> I try to rotate that block using transformrotate(180deg).This is working fine in firefox and chrome and IE Edge.When i open IE9 it is not working.How to solve this issue.

Mr.Pandya
  • 1,899
  • 1
  • 13
  • 24

1 Answers1

0

IE9 does not support transform: rotate(180deg), you must add -ms prefix to make element transform.

Code Sample: https://jsfiddle.net/s8hdhurc/

<html>
        <head>
            <meta http-equiv="X-UA-Compatible" content="IE=edge" />
            <!-- This is important as -ms-rotate does not work in quirks mode -->
            <style>
                .rotate {
                    -ms-transform: rotate(180deg); /* IE 9 */
                    -webkit-transform: rotate(180deg); /* Safari */
                    transform: rotate(180deg);
                }
            </style>
        </head>
        <body>
            <div class="rotate">
                <img src="http://upload.wikimedia.org/wikipedia/commons/b/b0/NewTux.svg">
            </div>
        </body>
    </html>
h3lL0W0RLd
  • 79
  • 3
  • 9