translateY() CSS Function

Description

The translateY() CSS function shifts the element relative to its original location by the specified vertical value.

Syntax

transform: translate(ty);

Values

  • tyVertical shift. A positive value moves up, a negative value down.
Any length units accepted in CSS are accepted as values ​​- for example, pixels (px), inches (in), points (pt), etc. A positive value shifts down, a negative one up. A value of 0 does not change the position of the element.

Example

<img class="translate" src="images/nature.jpg" alt="Nature Image">
.translate {
transform: translateY(-50px);
}

Browser Support

Desktop
Explorer Edge Chrome Firefox Opera Safari
??????
Tablets / Mobile
Android Chrome Firefox Opera Safari Samsung
??????