The Transformation module is a tremendous addition in CSS3, it takes the way we manipulate elements on a website to the next level.
There are some experiments that really amaze me, examples such as this one. However, we are not going to build something like a CSS-only icon that can somehow transform into an Autobot, as it may be overwhelming and not quite usable in real life as well.
Instead, this time, we will be stepping back and reviewing the basics of CSS3 2D Transformations to see how it works at a fundamental level.
The Syntax
The CSS3 Transformations module basically allows us to transform an element to a certain extent such as translating, scaling, rotating and skewing.
The official syntax is transform:method(value)
. However, like any other CSS3 great additions that is still in the early stages, the current browsers still need the syntax version to run the transformations.