When I try to use the transform: rotate(xDeg); (in my case transform: rotate(90deg)) it just doesn’t rotate no matter what tutorial I follow or what I do.
body {
background-color: black;
}
.rotate {
width: 200px;
height: 200px;
background-color: red;
margin: 200px;
}
.rotate:hover {
transform: rotate(90deg);
}
<div class="rotate"></div>
>Solution :
You should add transition otherwise you will not see the difference
body{
background-color:black;
}
.rotate {
width:200px;
height:200px;
background-color:red;
margin:200px;
transition: transform .5s ease-in-out;
}
.rotate:hover {
transform: rotate(90deg);
}
<html>
<link rel="stylesheet" type="text/css" href="e.css">
<div class="rotate"></div>
</html>