1
HTML/CSSAdvanced#css#performance
HTML/CSSIntermediate#css#transforms
What CSS transform functions are commonly used?
Answer
translate() moves an element, scale() resizes it, rotate() spins it, and skew() distorts it, all without affecting the document flow (unlike changing top/left/width). transform-origin controls the pivot point, and GPU-accelerated transforms are more performant than animating layout properties.
Example
.card:hover {
transform: translateY(-8px) scale(1.03) rotate(1deg);
transition: transform 0.2s ease;
}