Use @each to Map Over Items in a List (Sass)

whats wrong in the Sass code?

my output is showing correct, i don’t understand where i made mistake?

Your code so far


<style type='text/sass'>
  @each $color in blue, black, red {
    .#{$color}-bg { background-color: $color; }
  }
  div {
    height: 200px;
    width: 200px;
  }
</style>

<div class="blue-bg"></div>
<div class="black-bg"></div>
<div class="red-bg"></div>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/front-end-libraries/sass/use-each-to-map-over-items-in-a-list

1 Like

Try using a browser like Chrome. If you are using Safari, it does not have the latest features which FCC uses for it’s testing.

There’s nothing wrong with your code. I’m using Firefox and sometimes your code passes and sometimes not. I tried deleting some spaces and newlines and then rentering them (or not). Sometimes the code passed. When it did, I cleared the success notification and immediatley resubmitted. Then it mysteriously didn’t pass. There’s definitely a bug in the test suite.

1 Like

i use chrome browser

I’m also having this problem.