There are different data types you can assign to a variable in CSS.

In addition to the color data type we have seen, there are also:

  1. Numbers, such as 8.11, 12, and 10px. Notice that while 10 has a unit of px associated with it, it is still considered a number.

  2. Strings of text, with and without quotes. Some examples are "potato", 'tomato', span.

  3. Booleans, or simply true and false.

  4. null, which is considered an empty value.



In main.scss, make a variable of type number at the top of your file:

$icon-square-length: 300px;

Add the following inside the class selector .icon:

width: $icon-square-length; height: $icon-square-length;

Click “Run” to see your changes in the browser and inspect output in main.css.

Take this course for free

Mini Info Outline Icon
By signing up for Codecademy, you agree to Codecademy's Terms of Service & Privacy Policy.

Or sign up using:

Already have an account?