Learn

In addition to color, numbers, strings, booleans, and null, Sass also has two other data types, lists and maps.

Lists can be separated by either spaces or commas. For example, the following list denotes font properties, such as:

1.5em Helvetica bold;

Helvetica, Arial, sans-serif;

Note: You can also surround a list with parentheses and create lists made up of lists.

Maps are very similar to lists, but instead each object is a key-value pair. The typical map looks like:

(key1: value1, key2: value2);

Note: In a map, the value of a key can be a list or another map.

Instructions

At the top of main.scss, create a new list variable:

$standard-border: 4px solid black;

Find all of the instances that use 4px solid black in main.scss and replace them with the $standard-border variable reference. You’ve been using a list and you didn’t even know it!

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

Take this course for free

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

Or sign up using:

Already have an account?