Rotate

The rotate() function rotates an element around the point of origin (as with scale, by default this is the element’s center), by a specified angle value.

Generally, angles are declared in degrees, with positive degrees moving clockwise and negative moving counter-clockwise. We can also provide angles in grads, radians, or turns.

The syntax is as follows:

transform:rotate(angle).

An example using rotate.

snippet

#ad3 h1:hover span {
	color: #484848;
	-webkit-transform:rotate(10deg) translateX(40px) scale(1.5);
	-moz-transform:rotate(10deg) translateX(40px) scale(1.5);
	-ms-transform:rotate(10deg) translateX(40px) scale(1.5);
	-o-transform:rotate(10deg) translateX(40px) scale(1.5);
	transform:rotate(10deg) translateX(40px) scale(1.5);
}