CSS 3D translate

by Mohammed Ismail Ansari

HTML

<div id="transformed-div">
Listen, and understand! That Terminator is out there! It can't be bargained with. It can't be reasoned with. It doesn't feel pity, or remorse, or fear. And it absolutely will not stop, ever, until you are dead.
</div>

CSS

body
{
    -webkit-perspective: 500px;
}

#transformed-div
{
    height: 200px;
    width: 200px;
    padding: 10px;
    border: 1px solid Black;
    background-color: Cyan;
    -webkit-transform: translate3d(0px, 0px, 50px);
}

JavaScript

// CSS 3D translate