Sass: Use @each to Map Over Items in a List

whats wrong with this new exercises, can sb check everything is ok?, on screen is all good but chellenge not good

<style type='text/sass'>
  $colors:(color1:blue,color2: black,color3: red);
  @each $key, $color in $colors {
    .#{$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> 

i using Mozilla and i try to do it on Chrom browser, dont work, pls help

<style type=‘text/sass’>

$color-bg: (color1: blue,color2: black,color3: red);

@each $key, $color in $color-bg {

.#{$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>

1 Like