CSS3 Click Chart | CSS3 Browser Support and Information

Translate Transforms

Allows you to position an element vertically and/or horizontally, similar to CSS positioning, using a function as a value for the transform property.

Specification

Transform Functions on W3C

Example Code

.element {
    -webkit-transform: translate(25px, 50px);
    -moz-transform: translate(25px, 50px);
    -o-transform: translate(25px, 50px);
    -ms-transform: translate(25px, 50px);
    transform: translate(25px, 50px);
}

Live Demonstration

This element is positioned, or translated, using CSS3 transforms.

Desktop Browser Support

Standard Syntax:
IE10+, Firefox 16+

Vendor Prefix:
IE9+, Firefox 3.5+, Chrome 4+, Safari 3.1+, Opera 10.5+

Tools / Polyfills

cssSandpaper
Transformie

Tutorials / Articles

A Primer on CSS3 Transforms (SitePoint)