Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Tamsin Waters
Tamsin Waters
6,116 Points

text properties code challenge - unitless line height

Help - i am really confused about the 'unitless line heights' and what the question is asking in the challenge here - I tried reading a bit more on the article about unitless line heights, and also looked up the other question/answer related on the forum!

The challenge is saying: Use a unitless line height that is 1.5 times the paragraph's font size.

After a massive discussion with my dad - i've come to the conclusion that in order to answer this question you have to assume that as there is no specified font-size... you should assume it's a defualt font size of 16px - In order to figure out the default line height in this mark up, you have to mulitply the default fontsize by 1.5 - which gives you your line height of 24....(16 * 1.5 =24)

  • then in order to use a unitless line height that is 1.5 times the paragraph font size you need to multiply you default line-height by 1.5 (24 * 1.5 ) which gives you 36px.....

Can I now safely assume that in order to find the default line height, you must know the font size, in order to multiply by 1.5 to get the line-height, to be able to multiply the line height to give a unitless line height number??

4 Answers

Paul Graham
Paul Graham
1,396 Points

You'll need the font-size to calculate the value a unitless line height is set to. Chrome Dev Tools does that for you by selecting a block and looking at the calculated styles. But if the question says to set the line height to 1.5x the paragraph size the attribute should simply be defined line-height: 1.5, there's really nothing else you need to know.

Tamsin Waters
Tamsin Waters
6,116 Points

So you're saying to answer that question in their exercise I could of just put line height: 1.5;?

Paul Graham
Paul Graham
1,396 Points

Yes

IBRAHIM YOUNUS
IBRAHIM YOUNUS
2,137 Points
IBRAHIM YOUNUS
IBRAHIM YOUNUS
2,137 Points

the answer is : a unitless number value

hani munshi
hani munshi
3,801 Points
hani munshi
hani munshi
3,801 Points

p { line-height: 1.5em; }

Chris Stauffer
PLUS
Chris Stauffer
Courses Plus Student 786 Points
Chris Stauffer
Chris Stauffer
Courses Plus Student 786 Points

What lesson is this from?

trevorw
trevorw
17,470 Points

This is in the course: CSS Basics

  • then the final challenge in the 3rd stage titled - Understanding Values and Units

Just be aware that a year ago there was a different CSS course (maybe same name?), as the above refers to an "updated" CSS course - I took the original one about a year or so (?) and going thru this as refresher. Always good to keep brushing up plus, it's a course "suggested" to take before an intermediate 'CSS Beyond the Basics' course.

Hope that helps!