Categories
CSS

How to apply multiple transforms in CSS?

Spread the love

To apply multiple transforms in CSS, we set the transform property with values all in 1 line.

For instance, we write

li:nth-child(2) {
  transform: rotate(15deg) translate(-20px, 0px);
}

to set transform to rotate(15deg) translate(-20px, 0px) to rotate by 15 degrees and translate 20px to the left.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *