## Are you ready?

**1** questions to solve.

Instructions

- This quiz goes to full-screen once you press the Start button, or any Next button after exiting the quiz window.
- At the end of the quiz, you are able to review all the questions that you answered wrong and see their explanations.

How can we translate an element to the

**right by 500px**?All three functions listed above will move the element to the right by 500px. Hence the choice (D).

What will translate(0, 100%) do to an element?

When percentages appear in translate() they are always relative to the respective dimension where they're used. For the

**x**parameter they are relative to the**element's width**, whereas for the**y**parameter, to its**height**.How can we rotate an element

**clockwise**by**45 degrees**?Clockwise means that we have to rotate the element by a positive value of 45deg. Hence the choice (A). Refer to CSS Transformations - Rotations for more info.

What will the rule transform: rotate(3.142rad) below do to an element?

A positive angle for the function rotate() makes an element rotate clockwise by the given angle. For more info refer to CSS Transformations - Rotations.

How can you achieve the following result for the div shown? (Angle of skew = 30deg).

Tilted element

The element is tilted in the x-axis hence skewX() would've been applied to it. Moreover since it is

*leaning forwards*it would've had a negative skew angle. Hence the choice (B).How can you both translate an element by the coordinates

**(300px, 400px)**and rotate it**counterclockwise by 30deg**?To add multiple transformations to an element we would have to add them, one after another, delimited by a space in the transform property.

Enlarge an element using the scale() function such that it becomes

**twice as big as before**.To make an element

*twice as big as before*we have to enlarge it by a factor of 1.141 (which is the square root of two). For the answer to why we need to do so, please refer to CSS Transformations - Scaling.What will transform: scaleX(2) do to an element?

scaleX(2) will enlarge an element to become twice as large horizontally as before. Refer to CSS Transformations - Scaling for more info.