translateZ()

The translateZ() function is a transform function used to move an element along the z-axis in three-dimensional space.

It takes a translation value tz as an argument. This value specifies the amount by which an element is to be translated.

The translation value tz is provided as a <length>. Not including a unit type will cause the number to be interpreted as a “user unit”.

Positive translation values will move the element along the positive direction of the z-axis, and negative values will move it in the opposite direction.

Examples:

transform: translateZ(300px);
transform: translateZ(-5em);
transform: translateZ(4vh);
      

The official syntax looks as follows:

transform: translate(tz);
                

For a better understanding of the transform functions, please refer to the transform entry.