Simple CSS transform translate example highlighting original position

The solid red div element below would usually be displayed directly under this text, flush with the border. An -o-transform: translate(50px, 100px); transition is applied to move it 50px to the left and 100px down. A ghost element is shown to illustrate where the div would have been positioned if a transform wasn’t applied.