translateZ() | CSS-Tricks
The CSS translateZ() function adds depth to an element, drawing it closer or farther in space. In other words, it shifts an element along the Z-axis in a 3D space. .box:hover { transform: translateZ(100px); } .box.perspective:hover { transform: perspective(500px) translateZ(100px); } Either the perspective() function or perspective property is necessary for translateZ() to work. Without either one, there’s no…









