CSS translate() Function
Example
.example {
transform: translate(50px, 50px);
}Hello World!
Meaning
The translate() css function repositions an element in the horizontal and/or vertical directions.
This transformation is characterized by a two-dimensional vector. Its coordinates define how much the element moves in each direction.
Version: CSS3
Standard Syntax
translate(translateX, translateY)Browser Support
The numbers in the table specify the first browser version that fully supports the property.
Status
Function Arguments
The following table describes the arguments of this function.
| Argument | Description |
|---|---|
| translateX | Specifies the length or percentage values representing the abscissa (x-coordinate) of the translating vector. A percentage value refers to the width of the reference box defined by the transform-box property. |
| translateY | Specifies the length or percentage values representing the ordinate (y-coordinate) of the translating vector. A percentage value refers to the height of the reference box defined by the transform-box property. |