Snippet of HTML Code:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="css/demo.css" />
</head>
<body>
<div></div>
</body>
</html>
CSS Snippet:
div {
width: 100px;
height: 100px;
background: red;
-webkit-transition: width 2s, height 2s, -webkit-transform 2s; /* Safari */
-ms-transition: width 2s, height 2s, -webkit-transform 2s; /*IE */
transition: width 2s, height 2s, transform 2s;
}
div:hover {
width: 300px;
height: 300px;
-webkit-transform: rotate(180deg); /* Safari */
-sand-transform: rotate(180deg); /*IE9 */``
transform: rotate(180deg);
-ms-transform: rotate(180deg);
}
I'm facing issues with CSS3 transitions and transforms not working in IE9 and earlier versions.
I've tried using the -ms- and -sand- prefixes but it's still not functioning as expected.