From the course: CSS: Variables and Fluid Layouts

Unlock the full course today

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

Solution: Creating a type scale

Solution: Creating a type scale - CSS Tutorial

From the course: CSS: Variables and Fluid Layouts

Start my 1-month free trial

Solution: Creating a type scale

(exciting music) - [Instructor] So how'd you do on that challenge? You might of found that challenge a little bit let's say challenging, because one of the things you probably really wanted in order to solve this problem was an exponent. In other words you could have said 1.2 to the 5th power. And that would've been a much nicer way of writing this stuff. But unfortunately Calc only supports addition, subtraction, multiplication, and division. And since the goal here is to document where these numbers are coming from, this is the way I wound up writing these. So we started with a paragraph with our font size of 1M, base font size I'm just going to use the default browser size of 16 pixels. The H5 then is 1M times 1.2, the H4 is 1M times 1.2 times 1.2, and so on and so forth as we get to the larger numbers. When we go down to those smaller sizes, we just divide. And if we had even smaller sizes we would continue dividing…

Contents