移動translate()

transformプロパティでは、translate()で移動処理を適用することができます。たとえば、translate(100px, 200px)と指定すると、横方向に100ピクセル、縦方向に200ピクセル移動します。

　
transform: translate(100px, 200px)

translate()の前にrotate()で回転の処理を適用した場合、図のように移動処理が行われますので注意が必要です。

　
transform: rotate(30deg) translate(100px, 200px)