From the course: CSS: Variables and Fluid Layouts

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Challenge: Add custom properties to type scale

Challenge: Add custom properties to type scale - CSS Tutorial

From the course: CSS: Variables and Fluid Layouts

Start my 1-month free trial

Challenge: Add custom properties to type scale

“

(upbeat music) - [Instructor] Remember the type scale challenge from the calc chapter? We wrote a whole bunch of code to use calc in calculating our type scale, but ultimately we're not really happy with this result. It's clear how to derive each value in the scale, but oh my goodness, it's so repetitious, no one wants to look at this. So, let's rewrite this type scale using custom properties, now that you know a little bit more about them. To get you started on this, I'll give you a few hints. One of the things you probably want to do is think about what are the numbers that you're going to multiply together to take the place of all of these numbers that are repeated over and over again here? So, think about that for a second. So, you're probably going to do something like this. You'll have your root declaration here and inside of that we'll say something like our base size will be 1m, correct? And maybe we'll have a…

Contents