Use @for to Create a Sass Loop-Not sure if its buggy

Use @for to Create a Sass Loop-Not sure if its buggy
0

#1

Tell us what’s happening:

Not sure if its buggy or I wrote it wrong.
The result displayed seemed correct, tho.

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 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36.

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


#2

I don’t know why the Sass section is so buggy.

Here’s what I did. I copy pasted your code. Tried the tests failed.

Then I added a space right after “text-1” and somehow it magically worked? Yeah, you kinda have to shake it down somehow.


#3

This is a known bug:

However, running the same code in a different browser may help at times.
I recommend you trying that :slight_smile:


#4

Thank you guys for helping~~
I have tried to add space or delete the space, nor did it work…
I just decided to give up sass section first cause I had the same problem with the following challenge again…= = too waste of time.
I will try to run in different browser after.
Thanks again! =)