Arithmetic operations in SASS - Cheat Sheet & Quick Revision

Recall & Review

beginner

What are arithmetic operations in Sass?

Arithmetic operations in Sass are calculations like addition (+), subtraction (-), multiplication (*), division (/), and modulo (%) used to compute values for styles.

beginner

How do you add two numbers in Sass?

You use the plus sign (+). For example: $total: 10 + 5; sets $total to 15.

beginner

What happens if you divide two numbers in Sass?

Sass divides the numbers and returns the result. For example, $result: 20 / 4; sets $result to 5.

intermediate

Can you use arithmetic operations with units in Sass? Give an example.

Yes, you can. For example, $width: 100px / 2; results in 50px. Sass keeps the unit when dividing or multiplying.

intermediate

What is the modulo (%) operation in Sass?

Modulo (%) gives the remainder of division. For example, 7 % 3 equals 1 because 3 goes into 7 twice with 1 left over.

Which symbol is used for multiplication in Sass arithmetic?

A *

B -

C +

D /

The asterisk (*) is used for multiplication in Sass.

What will $result: 15 - 5; set $result to?

A 5

B 20

C 10

D 0

15 minus 5 equals 10.

If $size: 50px / 5;, what is the value of $size?

A 10px

B 5px

C 250px

D 10

Dividing 50px by 5 results in 10px, Sass keeps the unit.

What does the modulo operator (%) return?

A The quotient of division

B The sum of two numbers

C The product of two numbers

D The remainder of division

Modulo (%) returns the remainder after division.

Which of these is NOT a valid arithmetic operator in Sass?

A +

B &

C *

D /

The ampersand (&) is not an arithmetic operator in Sass.

Explain how you can use arithmetic operations in Sass to calculate widths with units.

Think about how Sass handles units when you multiply or divide numbers.

Describe the modulo operation and give a simple example of when it might be useful in Sass.

Modulo helps find leftovers after dividing numbers.