Need assistance in Use each to Map Over Items in a List

1

Challenge Name

Use each to Map Over Items in a List has an issue.

Issue Description

Even when I employed a workaround by hardcoding the CSS needed to pass the tests, it didn’t work… Something is messed up with the Sass compiler and the test suite…

Browser Information

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/59.0.3071.109 Chrome/59.0.3071.109 Safari/537.36.

Screenshot

Your Code



<style>
  @each $color in blue, black, red {
    .#{$color}-bg { background-color: $color; }
  }
  
/*Hardcoded CSS to bypass test-suite*/
  .blue-bg {
  background-color: blue;
  }

  .black-bg {
  background-color: black;
  }

  .red-bg {
  background-color: red;
  }

  
  div {
    height: 200px;
    width: 200px;
  }
</style>

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