This quiz goes to full-screen once you press the Start button.
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?
How can you achieve the following result for the div shown? (Angle of skew = 30deg).
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.