Rotate div CSS
In this article, we will show how to rotate a div in CSS. We can achieve that using the CSS “transform” property.
<!DOCTYPE html>
<html>
<head>
<title>Disable button</title>
<style type="text/css">
.rotate{
width: 200px;
height: 200px;
background-color: blue;
margin: 200px;
transition: all 0.5s ease-in-out;
}
.rotate:hover{
transform: rotate(45deg);
}
</style>
</head>
<body>
<div class="rotate"></div>
</body>
</html>
Output:
In the above, we have div with classname ‘rotate’. In CSS you can use the transform property and give the value as “rotate” in the hover of the div. And you should give the degree value of the rotate transform as in the above code. Above code we give 45deg in the transform so, the div will rotate 45 degrees. You can give the value in degrees only.