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 Sass Basics Write Smart and Efficient CSS with Sass Write a Sass Function

In the @return statement, divide $target by $context, and multiply it by 1rem. This will return a rem value.

Problem: Make sure you return '$target' divided by '$context'.

My answer:

$base-font-size: 16px;

// Write your function here

@function px-to-rem($target, $context: $base-font-size) {

@return($target / $context) * 1rem;

}

?? :(

style.scss
$base-font-size: 16px;

// Write your function here

@function px-to-rem($target, $context: $base-font-size) {

  @return($target / $context)  * 1rem;

}
Niels Anders
Niels Anders
7,408 Points

add a space between @return ()

@return ($target / $context) * 1rem;

6 Answers

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,252 Points

I was able to finish the challenge by removing the parentheses between $target and $context in the @return statement.

style.scss
@function px-to-rem($target, $context: $base-font-size) {
  @return $target/$context * 1rem;
}

Why is this the case? Removing the parenthesis, I mean.. The video shows the @return with parenthesis, and it sounds like Kristian Woods had a working answer with the same code that the OP had.. Is this a treehouse thing, or is it correct syntax to remove parenthesis after certain conditions..?

I also couldn't make it work until I removed the parenthesis, which I understand but also don't know WHY removing them was the last step needed.

@function px-to-rem($target, $context: $base-font-size) {
  @return ($target/$context) * 1rem;
}

I can't see a difference in our code.

sometimes you just need to refresh the page

Rizwan Ahmed
Rizwan Ahmed
6,578 Points

I am now able to do it by removing parenthesis, it does not make sense but it worked !

Justin Farrar
Justin Farrar
7,780 Points

and Here I was thinking I've gone crazy ... XD

Chris Adams
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Chris Adams
UX Design Techdegree Graduate 32,279 Points

I just had the same issue, and also resolved it by removing the parenthesis. Hopefully Treehouse can address this soon.

Hey all. Still an issue with the parenthesis with this. I'll post in Slack and see if I can get a response.

the top code is right. and just leave a space after @return as Niels said. it works for me. but if it is still doesn't work. just leave it. sometimes, computer, treehouse system has issue.

// Write your function here

@function px-to-rem($target, $context:$base-font-size){ @return ($target/$context)*1rem; }

Remove space between return and parenthesis $base-font-size: 16px;

// Write your function here @function px-to-rem($target, $context: $base-font-size){ @return ($target / $context) * 1rem ; }