Sass - For loop is causing error on just .text-1

HTML-CSS
1

Tell us what’s happening:

Every class is working correctly except for “text-1” according to the tests. It is working properly though.

Looking through similar submissions, I have tried resubmitting over and over to no success. I have tried manually setting text-1 to 10px and looping through the rest.

I am confident I am submitting the correct code, but this error is blocking me. Anyone have any recommendations?

Your code so far


<style type='text/sass'>

@for $j from 1 through 5 {
    .text-#{$j} { font-size: 10px * $j; }
}

</style>
<p class="text-1">Hello</p>
<p class="text-2">Hello</p>
<p class="text-3">Hello</p>
<p class="text-4">Hello</p>
<p class="text-5">Hello</p>

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.110 Safari/537.36.

Challenge: Use @for to Create a Sass Loop

Link to the challenge:
https://www.freecodecamp.org/learn/front-end-libraries/sass/use-for-to-create-a-sass-loop

2

It’s possible that there may be default settings on your browser which set a minimum font size. (I know that apple devices do this by default.) You can look at the advanced settings for your browser to see if that is the case. You can also just skip the lesson if you don’t want to mess with browser settings.

3

Thank you for the suggestion! I was able to fix it without going into the browser settings. I have set the page size to about 75% since the FCC update because the text is so large, and what you said about browser setting made me think I might have to set that back to 100% and it went through first time. Appreciate your help!

4

I’m glad you figured it out. Happy coding!