Translate Elements in 2D with the transform CSS Property

Share this video with your friends

Send Tweet

The transform property in CSS gives you the ability to transform elements in 2D or 3D. The most common transforms used to change elements are rotate, skew, translate, and scale.

In this video we will look at translate.

If you want to move an element on the web you use the translate property. This property moves an element left and right on the x-axis, up and down on the y-axis or both.

If you want to move an element up you use a negative number on the y-axis. This can be confusing when you are first beginning to animate on the web.