The div element below is initially scaled by a factor of two, then rotated 45 degrees clockwise then moved 80 px on the X axis. As the element is rotated before it is translated the X and Y axis are also rotated 45 degrees, so applying a 80px X axis translation will move the element down and to the right at a 45 degree angle too. This is achieved using -o-transform: scale(2) rotate(45deg) translate(80px);.