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 Rodrigo Chousal
Rodrigo Chousal
16,009 Points

What is wrong in my code?

Here are the instructions: Select the link with the class more. Using the rem unit, set its font size back to the base font size of the root HTML element. This is my line of code: link.more{font-size:rem;}

6 Answers

Paul Austin-Menear
PLUS
Paul Austin-Menear
Courses Plus Student 5,587 Points
Paul Austin-Menear
Paul Austin-Menear
Courses Plus Student 5,587 Points

Hey man, good start! The format of your markup is mostly right, but there are a couple of minor errors. Try this:

.more a { font-size: Xrem; }

Where X is the numerical value of the font size you need. The element for links is selected with the a tag. Keep going and have fun!

Rodrigo Chousal
Rodrigo Chousal
16,009 Points
Rodrigo Chousal
Rodrigo Chousal
16,009 Points

Thank you! But there is another problem, the instructions do not give me the numerical value that my html has. Should I create my own using: "html{font-size:16px}"?

Rodrigo Chousal
Rodrigo Chousal
16,009 Points
Rodrigo Chousal
Rodrigo Chousal
16,009 Points

Thank you, but if I try to make the other elements rems the rule will no longer pass because the previous instructions said to use ems.

Paul Austin-Menear
PLUS
Paul Austin-Menear
Courses Plus Student 5,587 Points
Paul Austin-Menear
Paul Austin-Menear
Courses Plus Student 5,587 Points

Ahhh I see. Yes, if it wasn't given already, then you need to define the size of the font at the html level. With a context size of 16px, 16px=1rem.

That's a long winded way of saying that you're right =)

Cheers!

Rodrigo Chousal
Rodrigo Chousal
16,009 Points

It still doesn't accept my code... It is the following:

html{font-size:16px;}
h1{font-size:2.5em;}
p{font-size:1.5em;}
.more a { font-size: 1rem; }
Paul Austin-Menear
PLUS
Paul Austin-Menear
Courses Plus Student 5,587 Points
Paul Austin-Menear
Paul Austin-Menear
Courses Plus Student 5,587 Points

Try making all of your units rem (instead of em).

If that doesn't work, it might be a bug in treehouse.

The purpose of rem units is to address a deficiency of em units. Ems will calculate size based on the size defined (or inherited in) the parent element. So, you can have an element defined as 1em be an entirely different size as another element defined as 1em (consistency issue). Rem addresses this by calculating size solely based on the size defined in the root element (html).

Russell Estes
Russell Estes
2,227 Points
Russell Estes
Russell Estes
2,227 Points

This code worked for me. I was directed back to task 1 which said to set the 'base' font-size to 16px. So I used 'base' instead of 'html'...seems to work:

base { font-size:16px; }

h1 { font-size:2.5em; }

p { font-size:1.5em; }

.more { font-size: 1rem; }