2. What is CSS transform?

2.1. The translate() Method


          To translate an element from its current position to another, the translate() method is used. The movement is based on the given X-axis and Y-axis within the given parameter.

          The translate() method requires two parameters. The first parameter is for the X-axis, while the second parameter is for the Y-axis. In the given code above, the div element is moved 50px to the right and 100px going down from its original position. If only 1 parameter is listed (ex. translate(50px);), it only moves the element in the X-axis. Below is an example code and the resulting output


div { transform: translate(50px,100px); }